Как вызвать запрос AJAX на событие смены даты?

index.php

<script type="text/javascript" src="jquery-1.4.2.js"></script> <script type="text/javascript" src="ajax.js"></script> <a href='one.php' class='ajax'>One</a> <a href='two.php' class='ajax'>Two</a> <div id="workspace">workspace</div> 

one.php

 $arr = array ( "workspace" => "One" ); echo json_encode( $arr ); 

two.php

 $arr = array( 'workspace' => "Two" ); echo json_encode( $arr ); 

ajax.js

 jQuery(document).ready(function(){ jQuery('.ajax').live('click', function(event) { event.preventDefault(); // load the href attribute of the link that was clicked jQuery.getJSON(this.href, function(snippets) { for(var id in snippets) { // updated to deal with any type of HTML jQuery('#' + id).html(snippets[id]); } }); }); }); 

Над кодом работает отлично. Когда я нажимаю ссылку «Один», тогда строка «Один» загружается в рабочую область DIV, и когда я нажимаю ссылку «Два», тогда строка «Два» загружается в рабочее пространство DIV.

Вопрос:

Теперь я хочу использовать выпадающее меню для загрузки one.php и two.php в рабочую область DIV вместо ссылок в index.php. Когда я использую ссылку, я использую class = 'ajax' в свойствах ссылок, но как вызвать ajax-запрос при выпадающем событии изменения?

благодаря

Измените свой код следующим образом:

 jQuery('#dropdown_id').live('change', function(event) { jQuery.getJSON($(this).val(), function(snippets) { for(var id in snippets) { // updated to deal with any type of HTML jQuery('#' + id).html(snippets[id]); } }); }); 

И ваш выпадающий список должен выглядеть так:

 <select id="dropdown_id"> <option value="one.php">One</option> <option value="two.php">Two</option> </select> 

Присвойте значение href как значения элемента списка в раскрывающемся списке. При изменении выпадающего списка выполните вызов ajax.

Имя класса «ajax» просто для справки (полезно, если вы хотите обрабатывать событие для более одного элемента).