爲什麼這個動態選擇框不適用於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？

回答

相關問題