如何在下拉列表更改事件上调用AJAX请求？

的index.php

  One Two 
workspace 

https://stackoverflow.com/questions/3429176/how-to-call-ajax-request-on-dropdown-change-event/one.php

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

https://stackoverflow.com/questions/3429176/how-to-call-ajax-request-on-dropdown-change-event/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]); } }); }); }); 

上面的代码工作得很好。 当我单击链接’One’时，字符串’One’被加载到工作区DIV中，当我单击链接’Two’时，字符串’Two’被加载到工作区DIV中。

题：

现在我想使用下拉列表在工作区DIV中加载https://stackoverflow.com/questions/3429176/how-to-call-ajax-request-on-dropdown-change-event/one.php和https://stackoverflow.com/questions/3429176/how-to-call-ajax-request-on-dropdown-change-event/two.php而不是index.php中的链接。 当我使用链接时，我在链接属性中使用class =’ajax’但是如何在下拉更改事件中调用ajax请求？

谢谢

Answer 1

像这样更改你的代码：

 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]); } }); }); 

您的下拉列表应如下所示：

  One Two  

Answer 2

在下拉列表中将href指定为列表项值。 更改下拉列表，进行ajax调用。

类名“ajax”仅供参考（如果您想要处理超过一个元素的事件，则非常有用）。