为什么这个动态选择框不适用于jQuery 1.9.1？

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

来源

2014-02-16 RedGiant

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

那么首先，如果你已经做了一些自己调试（你为什么不？），你会看到，对于man参数没有值在AJAX POST请求到服务器传递。

使用萤火JavaScript调试器，它很快变得很明显，此行有过错：

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

而对于.attr的文档会告诉你，这应该只用于查询，明确哪里值设置 - 这不是select元素的情况。

因此改为使用.val()。

来源

2014-02-16 16:10:33 CBroe

试试这个

<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>

来源

2015-11-16 11:48:25

为什么这个动态选择框不适用于jQuery 1.9.1？

回答

相关问题