Question

我在JS中为零。我甚至都不知道A，B＆amp; JS的C.我正在写一张表格。我必须向用户提供他可以添加多个联系号码的设施。这是我的HTML。

<li>
    <div id="contact-number-wrapper">
        <div class="contact-number">
            <div class="field-del">
                <a href="#" class="field-del-button"></a>
            </div>
            <!--end of field del-->
            <div class="field-title">
                <select name="country">
                    <option value="contact-number" selected>Contact Number</option>
                    <option value="office-number">Office Number</option>
                    <option value="house-number">House Number</option>
                    <option value="mobile-number">Mobile Number</option>
                </select>
            </div>
            <!--end of field title-->
            <div class="field-input">
                <input autocomplete="off" class="input" id="contact-text-field" name="contact-text-field" type="text" value="+92 333 8141255" placeholder="" />
            </div>
            <!--end of field input-->
            <div class="field-privacy">
                <dl id="sample4" class="dropdown"> <dt><a href="#"></a></dt>
                    <dd>
                        <ul>
                            <li><a href="#">Public</a></li>
                            <li><a href="#">Friends</a></li>
                            <li><a href="#">Only me</a></li>
                            <li><a href="#">Custom</a></li>
                        </ul>
                    </dd>
                </dl>
            </div>
            <!--end of field privacy--> <span class="clearfloater"></span>
        </div>
        <!--end of caontact number-->
    </div>
    <!--end of contact number wrapper-->
    <button id="b-0" class="btn add-more" type="button">
        <img src="images/profile-page/add-new-field.png" alt="" />Add another</button>
</li>

这是我开发新的入门领域的JS。

$(document).ready(function () {
    var next = 1;
    $(".add-more").click(function (e) {
        var newdiv = document.createElement('div');
        newdiv.className = 'contact-number' + next + '';
        document.getElementById('contact-number-wrapper').appendChild(newdiv);
        newdiv.innerHTML = '<div class="field-del"><a href="#" class="field-del-button"></a></div><!--end of field del--><div class="field-title"><select name="country"><option value="contact-number" selected>Contact Number</option><option value="office-number">Office Number</option><option value="house-number">House Number</option><option value="mobile-number">Mobile Number</option></select></div><!--end of field title--><div class="field-input"><input autocomplete="off" class="input new-entry" id="contact-text-field' + next + '" name="contact-text-field' + next + '" type="text" value="" placeholder="Add New Number" /></div><!--end of field input--><div class="field-privacy"><dl id="sample-3' + next + '" class="dropdown"><dt><a href="#"></a></dt><dd><ul><li><a href="#">Public</a></li><li><a href="#">Friends</a></li><li><a href="#">only me</a></li><li><a href="#">Custom</a></li></ul></dd></dl></div><!--end of field privacy--><script>$(".dropdown dt a").click(function(e){$(this).parent().next().fadeToggle("fast");});$(".dropdown dt a").blur(function(e){if ($(e.target).not(".dropdown ul")){$(".dropdown dd").fadeOut();}});</script><span class="clearfloater"></span>';
        next = next + 1;
    });
});

我的问题是我在这篇文章中使用的下拉菜单。这也是一个JS支持的下拉列表，它在静态帖子中工作但是当我用JS创建动态帖子或新帖子时，这个下拉列表不起作用。有人告诉我在新的post函数中重新绑定下拉函数。但我在JS中无效我不知道该怎么做。请告诉我一些隐私下拉列表也应该在新帖子中工作的东西。这是我的隐私设置下拉列表的Js代码（包含在html中的field-privacy div中）。

$(".dropdown dt a").click(function(e){
    $(this).parent().next().fadeToggle("fast");
});
$(".dropdown dt a").blur(function(e){
    if ($(e.target).not(".dropdown ul")){
        $(".dropdown dd").fadeOut();
    }
});

Answer 1

这实际上是一个（非常......）常见的问题。

你必须使用所谓的“事件委托”：

$(document).on('click', ".dropdown dt a", function(e){
    $(this).parent().next().fadeToggle("fast");
});

$(document).on('blur', ".dropdown dt a" , function(e){
    if ($(e.target).not(".dropdown ul")){
        $(".dropdown dd").fadeOut();
    }
});

这适用于现在和未来的元素。它将监听元素的创建并自动将事件绑定到它们。

如何使Js在JS生成的帖子中工作？

1 个答案: