0

一段时间以来，我一直无法运行 ajax 脚本。

基本上，我需要用户从一个下拉框中选择一个选项，然后根据选择的内容，根据 MySQL 查询相应地填充第二个下拉框。

我的脚本看起来像

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

我的初始下拉框由 MySQL 查询填充，如下所示

<select name="front-size" onchange="ajaxfunction(this.value)">
     <?php
    $door_size = $db->prepare("SELECT DISTINCT door_size FROM doors WHERE door_model = '".$_SESSION['front_door']."'");
    $door_size->execute();
    while($row = $door_size->fetch(PDO::FETCH_ASSOC))
    {
        $size = $row['door_size'];
        echo '<option value="'.$size.'">'.$size.'</option>';
    }
    ?>
</select>

第二个下拉框为空

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

并且 process.php 应该根据之前选择的内容进行下一个查询（这可以独立工作）

<?php
    session_start();
    include ('config.php');

    $parent = $_GET['parent'];

    $update_option = $db->prepare("SELECT door_finish FROM doors WHERE door_model = '".$_SESSION['front_door']."' AND door_size = '".$parent."'");
    $update_option->execute();
    while($row = $update_option->fetch(PDO::FETCH_ASSOC))
    {
        $door_finishes = $row['door_finish'];
        echo '<option value="'.$door_finishes.'">'.$door_finishes.'</option>';

    }
?>

在 Firebug 中，当我选择我的第一个下拉菜单时，会显示此错误并且我无法解决它。

ReferenceError: ajaxfunction is not defined

ajaxfunction(this.value)

我怎样才能解决这个问题？

4

1 回答 1

0

您正在调用 ajaxfunction，但尚未在代码中的任何位置定义它。 

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

onchange=ajaxfunction(this.value)更广泛地说，当您的 ready 函数可以完成同样的事情时 ，为什么要在您的 html ( ) 中调用该内联？

<script type="text/javascript">
(function(){
$('select[name="first"]').change(function(){
//do stuff
});
$('select[name="second"]').change(function(){
//do other stuff
});
})
</script>

会更好

编辑：检查这个 jsfiddle 的工作示例http://jsfiddle.net/WF8CV/

于 2013-03-18T23:17:13.127 回答