Question

我发现使用PHP / MySQL / AJAX / jQuery的这个chained select box无法使用jQuery1.9.1。第一个选择框工作正常，但是当我选择第二个，使用type_list.php从sql检索数据时，即使触发了php文件，也无法提取任何数据。任何人都知道为什么它不能使用jQuery 1.9.1？

jQuery 1.9.1：Example - 无法正常工作。

jQuery 1.7.2：Example - 工作正常。

type_list.php：

<?php
// list of printer types for specific manufacturer
include("dbconfig.inc.php");

header("Content-type: text/xml");

$manid = $_POST['man'];

echo "<?xml version=\"1.0\" ?>\n";
echo "<printertypes>\n";
$select = "SELECT type_id, type_text FROM printer_types WHERE man_id = '".$manid."'";
try {
    foreach($dbh->query($select) as $row) {
        echo "<Printertype>\n\t<id>".$row['type_id']."</id>\n\t<name>".$row['type_text']."</name>\n</Printertype>\n";
    }
}
catch(PDOException $e) {
    echo $e->getMessage();
    die();
}
echo "</printertypes>";
?>

JS代码：

<script>
jQuery().ready(function($){

$('#loading')
    .hide()  // hide it initially
    .ajaxStart(function() {
        $(this).show();
    })
    .ajaxStop(function() {
        $(this).hide();
    })
;



// Ajax Called When Page is Load/Ready (Load Manufacturer)
jQuery.ajax({
                      url: 'man_list.php',
                      global: false,
                      type: "POST",
                      dataType: "xml",
                      async: false, 
                      success: populateComp
                }); 



//Ajax Called When You Change  Manufaturer
$("#manufacturer").change(function () 
    {
     resetValues(); 

        var data = { man :$(this).attr('value') };
    jQuery.ajax({
                      url: 'type_list.php',
                      type: "POST",
                      dataType: "xml",
                      data:data,
                      async: false, 
                      success: populateType
                }); 
    });

//Ajax Called When You Change Type of Printer
$("#printertype").change(function () 
    {

        var data = { 
        man :$('#manufacturer').val(),
        typ : $(this).attr('value')
        };
    jQuery.ajax({
                      url: 'model_list.php',
                      type: "POST",
                      dataType: "xml",
                      data:data,
                      async: false, 
                      success: populateModel
                }); 
    });

//Do What You Want With Result .......... :)
    $("#printermodel").change(function () 
    {

//'you select Model='+$('#manufacturer').val()+'type='+$('#printertype').val()+'And Model='+$('#printermodel').val()
alert('you select Model = '+$('#manufacturer option:selected').text()+' ,type= '+$('#printertype option:selected').text()+' And Model = '+$('#printermodel option:selected').text()
);
    });



                    }); 
    </script>

Answer 1

任何人都知道它为什么不能使用jQuery 1.9.1？

首先， if 你自己做了一点调试（为什么不是你？），你会发现man参数的值没有传递给对服务器的AJAX POST请求。

在FireBug中使用JavaScript调试器，很快就会明白，这条线是错误的：

var data = { man :$(this).attr('value') };

.attr的文档告诉您，这应仅用于查询显式设置的值 - select元素不是这种情况。

所以请改用.val()。

Answer 2

试试这个

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.js"></script>
        <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>

为什么这个动态选择框不能与jQuery 1.9.1一起使用？

2 个答案: