我正在使用Jqtransform脚本设置表单样式.
该表单包含一个选择器,用于登记某些城市,当我点击一个城市时,它应该更新该城市内的某些位置的选择器.

这是选择器的代码

<select name="city" id="city" class="wide" onchange="populateDestrict(this)"> 

它在默认样式下工作正常,但在应用JQ之后,它失去了它的功能

我在这之前问了一个问题LINK

我按照Dormilich所做的那样写作：

     $(function() { 
$("form.jqtransform").jqTransform();
$("#city").change(populateDestrict(this)); 
}); 

但它不起作用！

如果它有帮助,这里也是函数的代码

<script language="javascript">
    function populateDestrict(obj){
        var city=obj.value;
            if(city!=""){
                $.post('city_state.php',{ city: city},function(xml){ 
                    $("#state").removeOption(/./);
                    $("district",xml).each(function() {
                    $("#state").addOption($("key",this).text(), $("value",this).text());
                });
            });
            }
    }
</script>

任何帮助人们????????
谢谢

最佳答案:

您可能会遇到< select>具有<选项>的元素标签与值不同的元素.例如,您可能拥有与每个城市对应的唯一ID：

<form id="formTransform">   
   <div id="boxRelated">
      <select name="city">
         <option value="21">Gotham</option>
         <option value="12">New York City</option>
         <option value="34">Smallville</option>
      </select>
      <div class="clear"></div>   
   </div> 
</form>

只需在jqTransform列表中的选定链接上调用.text()即可获得标签,但不会显示< option>的值.元件.

要解决此问题,您可以使用父< li>的索引. jqtransform列表中的元素索引到< select>表格上的元素：

<script> 

   $("#formTransform").jqTransform();

   $("#boxRelated div.jqTransformSelectWrapper ul li a").click(function(){
      var value = $(this).parent().index();
      $("[name=city]").attr('selectedIndex', value);

      // will alert 21, 12, or 34 depending on which one was selected
      alert($("[name=city]").val()); 
      return false; 
   }); 

</script>