在firebug或触发中未显示Jquery脚本

Question

我正在尝试通过使用jquery/ajax脚本获得一个下拉框来更改第二个下拉框。Firebug显示Jquery正在工作，但我的脚本根本没有显示。

<script type="text/javascript">
        function ajaxfunction(parent)
        {
            $.ajax({
                url: '../functions/process.php?parent=' + parent;
                success: function(data) {
                    $("#sub").html(data);
                }
            });
        }
    </script>

process.php只是一个MySQL查询(它是有效的)

我的初始下拉框中填充了一个MySQL查询

<select name="front-size" onchange="ajaxfunction(this.value)">
//Query
</select>

然后第二个下拉框

<select name = "front-finish" id="sub">
</select>

我该如何解决这个问题呢？

Answer 1

调用内联函数一点也不好...正如Web2.0标准建议使用低调的JS而不是onevent attributes....check来解释为什么here..使用ajax的另一种thigs..correct方法是使用类型和数据ajax选项在控制器中发送值。

<script type="text/javascript">
    $(function(){
    $('select[name="front-size"').change(function()
    {
        $.ajax({
            url: '../functions/process.php',
            type:'get',
            data:{'value' : $(this).val()}, 
            dataType:"html",   //<--- here this will take the response as html... 
            success: function(data) {
                $("#sub").html(data);
            }
        });
    });
 });
</script>

你的proces.php应该是..。

 <?php
   //db query ...thn get the value u wanted.. 
   //loop through it..
   $optVal .= "<option value="someDbValue">some DDB values</option>";
   // end loop

   echo $optValue;exit;

已更新

看起来你在你的select中仍然有onchange="ajaxfunction(this.value)"，删除它是不需要的，javascript中的ajaxfunction也是如此…

<select name="front-size" >    
                   //----^ here remove that

Answer 2

在您的process.php中，如下所示

echo "<select name='front-finish' id='sub' onchange='ajaxfunction(this.value)'>";

这样，您需要通过ajax将"onchange“函数添加到新创建的选择框中

或者，您可以删除onchange函数并编写如下代码

$("select[name^='front-']").live('change',function(){
   //Do your ajax call here
});

Answer 3

使用允许我们在动态加载的内容上添加事件的jQuery.on()。

$('select[name^="front-"]').on('change',function(e){
    e.preventDefault();
    var value = $(this).val();
    ajaxfunction(value);
});

[name^="front-"]这将选择name以front-开头的所有SELECT框。