jQuery:当使用.click，.trigger()进行操作时，只有两个.click()事件中的第一个会运行

Question

我想我已经看到了很多类似的问题，但到目前为止我还没有找到答案。我调整了网上的一些依赖下拉列表，当用户点击时，这些下拉列表非常有效：你点击第一个列表（选择），当你选择一个有"子项"的项目时，这些会显示在第二个下拉列表中，以此类推。当我想传递默认值时，问题就开始了。第一个列表得到了它的值，nu问题。然后，为了生成第二个下拉列表，我在相应的Id中添加了一个.click（）事件。它实际上显示了第二个下降列表以及所选元素（从下拉填充函数传递）。然而，一旦加载，无论有多少实际点击或代码模仿点击，第二个下拉菜单都不会运行它的点击功能，它只允许您选择，但不会生成第三个下拉菜单，当不传递任何值时，它可以完美地工作。

可能出了什么问题？

以下是主要的JS代码，它位于页面正文之前：

var demo = {};
demo.globals = {
princ: 0,
princ2: 0,
princ3: 0
}
$(document).on('ready', function() {
$(document).on('click', '#lprinc', function() {
     var value = $(this).val();
      if (value==0){
            $('#lprinc2').html('<option value="">----</option>').attr('disabled', true);
            $('#lprinc2').css({ 'visibility': 'hidden'});
      } 
      else{ 
            $('#lprinc2').removeAttr('disabled');
            $('#lprinc2').css({ 'visibility': 'visible'});
            $('#lprinc3').html('<option value="">----</option>').attr('disabled', true);
            $('#lprinc3').css({ 'visibility': 'hidden'});                           
            if (value != demo.globals.princ) {
            demo.checkDropdown('princ', 'princ2', value, val2);
            demo.globals.princ = value;
            } 
    }
});
 if (val1!=''){
            $('#lprinc').trigger('click');
}
$(document).on('click','#lprinc2', function() {
     var value = $(this).val();
      if (value==0){
            $('#lprinc3').html('<option value="">----</option>').attr('disabled', true);
            $('#lprinc3').css({ 'visibility': 'hidden'});
      } 
      else{ 
            $('#lprinc3').removeAttr('disabled');
            $('#lprinc3').css({ 'visibility': 'visible'});       
            if (value != demo.globals.princ2) {
            demo.checkDropdown1('princ2', 'princ3', value, val3);
            demo.globals.princ2 = value;
            }
     }
 });
if (val2!=''){
         $('#lprinc2').trigger('click');
}    
if (val3!=''){
         $('#princ3').val(val3);
}     
}); 
demo.checkDropdown = function(dropDownName, nextDropDown, value, valorpass) {
jQuery.getJSON('/mod/update.php', { id : nextDropDown, value : value, val: valorpass}, function(data) {
    if (!data.error) {
        $('#lprinc2').html(data.list).removeAttr('disabled');
    } else {
        $('#lprinc2').html('<option value="">----</option>').attr('disabled', true);
        $('#lprinc2').css({ 'visibility': 'hidden'});
        $('#lprinc3').html('<option value="">----</option>').attr('disabled', true);
        $('#lprinc3').css({ 'visibility': 'hidden'});
    }
});    
$("select[name='" + nextDropDown + "']").html(dropDownHtml);
}
demo.checkDropdown1 = function(dropDownName, nextDropDown, value, valorpass) {
jQuery.getJSON('/mod/update.php', { id : nextDropDown, value : value, val: valorpass}, function(data) {
    if (!data.error) {
        $('#lprinc3').html(data.list).removeAttr('disabled');
    } else {
        $('#lprinc3').html('<option value="">----</option>').attr('disabled', true);
        $('#lprinc3').css({ 'visibility': 'hidden'});
    }
});     
$('#lprinc3').html(dropDownHtml);   

如有任何帮助，我们将不胜感激。我试过.one、.trigger（）、.trigerHandler（）、.click（），但都没有用。我一直在疯狂地公开他的一个。。。

添加：update.php：

if (!empty($_GET['value'])) {
$value = $_GET['value'];
$valor= $_GET['val'];
try {
    $objDb = new PDO('mysql:host=localhost;dbname=XXXXX', 'XXXXX', 'XXXXX');
    $objDb->exec('SET CHARACTER SET utf8');
    $sql = "SELECT * 
            FROM `categories`
            WHERE `master` = ?";
    $statement = $objDb->prepare($sql);
    $statement->execute(array($value));
    $list = $statement->fetchAll(PDO::FETCH_ASSOC);
    if (!empty($list)) {
        $out = array('<option value="0">Seleccione...</option>');
        foreach($list as $row) {
            $selstrg = "<option value='".$row['id']."' ";
            if ($row['id']==$valor){
                $selstrg = $selstrg." selected ='selected' ";   
            }       
            $selstrg = $selstrg.">".$row['name']."</option>";
            $out[] = $selstrg;          
        }
        echo json_encode(array('error' => false, 'list' => implode('', $out)));
    } else {
        echo json_encode(array('error' => true));
    }
} catch(PDOException $e) {
    echo json_encode(array('error' => true));
}
} else {
echo json_encode(array('error' => true));
}

Answer 1

更新的答案：

我认为您需要将jQuery事件更新为on。

更新代码，如：

$('#princ2').click(function() {

收件人：

$('#princ2').on('click', function() {

还有上的示例http://eduardoarria.comze.com/显示错误dropDownHtml is not defined以下代码行有问题：

$("select[name='" + nextDropDown + "']").html(dropDownHtml);

您尝试使用尚未声明或分配的dropDownHtml。删除试图将HTML设置为dropDownHtml的代码行。