Jquery点击功能仅在第二次单击后才起作用

时间:2017-02-14 03:33:08

标签: jquery

我动态创建了一个ul,但是当我在li标签内的a标签上使用click功能时,它只在第二次点击后才有效。这是我的剧本

<Project Sdk="Microsoft.NET.Sdk">
  <PropertyGroup>
    <OutputType>Exe</OutputType>
    <TargetFramework>net452</TargetFramework>
    <RuntimeIdentifier Condition=" '$(TargetFramework)' != 'netcoreapp1.1' ">win10-x64</RuntimeIdentifier>
  </PropertyGroup>
</Project>

这是我的HTML

var uList;
    $(document).ready(function () {
        uList = $("#room");
        $("#btn").click(function () {
            appendLI();
        });

    });
    function test() {
        if ($("#room li").length > 0) {
            $("li .roomName").on("click", function () {
                alert($(this).text());
            });
        }
    }
    function appendLI() {
        var li = $("<li/>").appendTo(uList);
        var aaa = $("<a/>").prop("class", "roomName").prop("href", "javascript:test();").text("Google 1").appendTo(li);
    }

1 个答案:

答案 0 :(得分:2)

点击事件未写在右边;

function test() {
        if ($("#room li").length > 0) {
            $("#room").on("click", '.roomName', function () {
                alert($(this).text());
            });
        }
    }

我在这里为你重新编写了你的​​代码块;

http://codepen.io/anon/pen/PWVmjJ