HTML

new Promise(function(resolve, reject) {
  setTimeout(resolve, 2000);
}).then(function() {
  console.log('do whatever you wanted to hold off on');
});

的Javascript

<div class="panel-body">
    <div class="col-md-3">
        <label for="trans_type">Transaction Type</label>
        <div class="input-group">
            <span class="input-group-addon"><i class="fa fa-group fa-fw"></i></span>
            <select class="selectpicker form-control"  data-live-search="true"  id="trans_type" name="trans_type" required>
                <option value="" selected>Select a Transaction Type</option>
                <option value=0>Class Experiment</option>
                <option value=1>Borrowment</option>
             </select>
         </div>
         <!-- /.input-group -->
     </div>
     <!-- /.col-md-3 -->
     <div class="col-md-3" id="lyr_1">
     </div>
     <!-- /.col-md-3 #lyr_1 -->
     <div class="col-md-3" id="lyr_2">
     </div>
     <!-- /.col-md-3 #lyr_2 -->
     <div class="col-md-3" id="lyr_3">
     </div>
     <!-- /.col-md-3 #lyr_3 -->
     <div class="row"><br><br><br><br>
     </div>
     <!-- /.row -->
     <div class="col-md-3" id="lyr_4">
     </div>
     <!-- /.col-md-3 #lyr_4 -->
 </div>
 <!-- /.panel-body -->

PHP

$(document).ready(function() {
    $("#trans_type").change(function() {
        if($("#trans_type").val() == 0) {
            $("#lyr_1")
                .html("<img src='assets/loader1.gif' class='text-center' alt='loading...' />")
                .load('models/getborreq_fields_model.php?mode=0', {}, function() {
                $('#trans0_adv').selectpicker('refresh');
            });
            $("#lyr_2")
                .html("<img src='assets/loader1.gif' class='text-center' alt='loading...' />")
                .load('models/getborreq_fields_model.php?mode=1', {}, function(){
                $('#trans0_sub').selectpicker('refresh');
            });
            $("#lyr_3")
                .html("<img src='assets/loader1.gif' class='text-center' alt='loading...' />")
                .load('models/getborreq_fields_model.php?mode=2', {}, function(){
                $('#trans0_exp').selectpicker('refresh');
            });
            $("#lyr_4")
                .html("<img src='assets/loader1.gif' class='text-center' alt='loading...' />")
                .load('models/getborreq_fields_model.php?mode=3', {}, function(){
                $('#trans0_grp').selectpicker('refresh');
            });
        } else if ($("#trans_type").val() == 1) {
            $("#lyr_1, #lyr_2, #lyr_3, #lyr_4").empty();
        }
    });
});

问题

我已经修复了事件部分。我使用

使用了你们的事件代表团

<?php
require_once '../classes/dbc_get_bor.php';
session_start();
$db_call = new dbc_get_bor();
if ($_GET["mode"] == 0) {
    echo '<label for="trans0_adv">Subject Adviser</label>
    <div class="input-group">
        <span class="input-group-addon"><i class="fa fa-group fa-fw"></i></span>
        <select class="selectpicker form-control"  data-live-search="true"  id="trans0_adv" name="trans0_adv" required>
            <option value="" selected>Select an Adviser</option>';
            $db_call->get_faculty();
        echo '</select>
    </div>
    <!-- /.input-group -->';
} else if ($_GET["mode"] == 1) {
    echo '<label for="trans0_sub">Subject Code</label>
    <div class="input-group">
        <span class="input-group-addon"><i class="fa fa-group fa-fw"></i></span>
        <select class="selectpicker form-control"  data-live-search="true"  id="trans0_sub" name="trans0_sub" required>
            <option value="" selected>Select an Adviser First</option>
        </select>
    </div>
    <!-- /.input-group -->';
} else if ($_GET["mode"] == 2) {
    echo '<label for="trans0_exp">Experiment #</label>
    <div class="input-group">
        <span class="input-group-addon"><i class="fa fa-group fa-fw"></i></span>
        <select class="selectpicker form-control"  data-live-search="true"  id="trans0_exp" name="trans0_exp" required>
            <option value="" selected>Select a Subject First</option>
        </select>
    </div>
    <!-- /.input-group -->';
} else if ($_GET["mode"] == 3) {
    echo '<label for="trans0_grp">Group #</label>
    <div class="input-group">
        <span class="input-group-addon"><i class="fa fa-group fa-fw"></i></span>
        <select class="selectpicker form-control"  data-live-search="true"  id="trans0_grp" name="trans0_grp" required>
            <option value="" selected>Select a Subject First</option>
        </select>
    </div>
    <!-- /.input-group -->';
}?>

但是现在我在操作新添加的元素时遇到了问题我的预期＆＃34;工作＆＃34;这里的代码是

$( "#example" ).on( "click", "#example", function() {})

事件

$('#lyr_1').on('change', '#trans0_adv', function () {
        $("#trans0_sub").html("<option value="" selected>Select Adviser's Subjects</option>");
    });

可以检测但是

$('#lyr_1').on('change', '#trans0_adv', function () {}

可＆＃39;吨。我试图将代码放在＃lyr_＃divs中的.load（）中，但它不起作用。我已经在网上搜索过但无法找到答案或类似的内容。

Answer 1

以编程方式修改<select>所选的选项不会触发change事件。

在使用以下内容执行更改后，您必须明确地触发它：

$("#trans0_sub").trigger('change');

然而，人们通常需要这样做，因为首先设计不正确。我并不是说以这种方式触发事件总是错误的，但如果你因为想要调用特定的已知行为来触发事件，那么你会更好明确说明您想要的行为。

E.g。

$('#some-select').change(function () {
    //some behavior
});

//later
$('#some-select').val(someValue).trigger('change');

写得更好：

$('#some-select').change(function () {
    someBehavior();
});

function someBehavior() {
}

//later

$('#some-select').val(someValue);
someBehavior();

Answer 2

change事件仅在用户与元素交互时才有效，因此，要工作，您必须手动激活事件，例如

$('select').html('blabla').change();

通过这种方式，您可以实现自己想要的目标：）

让JQuery识别新添加的元素（Event Prob解决了但是......）

HTML

的Javascript

PHP

问题

2 个答案: