Question

我目前的网页上有div，其中ID围绕是和否按钮。选择按钮后，jQuery会将ID中的信息替换为它调用的add_song.php文件。

当艺术家更改时，我在页面上的下拉菜单中有一个实时change并且有keyup直播add_song.php会更改add_song.php中的艺术家ID。问题是当我选择是或否时，如果我更改艺术家名称，则会加载change。

如果在点击是或否按钮后加载keyup而不是在更改艺术家时加载，我如何才允许add_song.php和change更改艺术家keyup / echo '<span class="edit-buttons"><input type="submit" value="yes" id="add_existing_song"></span>'; echo '<span style="padding-left:10px" class="edit-buttons"><input type="submit" value="no" id="add_new_song"></span>'; echo '<div id="display_add_new_song"></div>';。

这是PHP：

$(document).ready(function(){
      $("#add_new_song").live("click", function() {
      var artistid = $("#artist").val();
      $("#display_add_new_song").load("php/add_song_new.php?var1=" + artistid);
});
});

$(document).ready(function(){
      $("#artist").change(function() {
      var artistid = $("#artist").val();
      $("#display_add_new_song").load("php/add_song_new.php?var1=" + artistid);
});
});

$(document).ready(function(){
      $("#artist").keyup(function() {
      var artistid = $("#artist").val();
      $("#display_add_new_song").load("php/add_song_new.php?var1=" + artistid);
});
});

很抱歉这里是jquery代码：

{{1}}

Answer 1

您应该将keyup / change的事件绑定移动到.load callback function。 .load可能会接受第二个参数，即在内容加载后立即执行的回调，允许您在加载事件后立即将事件绑定到#artist。

此外，您可以将文档准备好后执行的JavaScript合并到一个块中，并且可以将要绑定的事件组合到相同的功能中，这将删除脚本中的一些重复代码。

考虑到您的代码，您应该将其更改为以下内容：

$(document).ready(function(){
    $("#add_new_song").live("click", function() {
        var artistid = $("#artist").val();
        $("#display_add_new_song").load("php/add_song_new.php?var1=" + artistid, function(){
            $("#artist").on("keyup change", function() {
                var artistid = $("#artist").val();
                $("#display_add_new_song").load("php/add_song_new.php?var1=" + artistid);
            });
        });
    });
});

jQuery只有在div中已存在时才会更改

1 个答案: