jQuery克隆链接没有响应点击事件

时间:2016-12-13 12:54:01

标签: javascript jquery

我目前的解决方案看起来基本上是这样的:

HTML:

<div class="bar top-bar">
    <div class="barline">
        <a href="#" id="item1">Link 1</a>
        <a href="#" id="item2" class="btn dropdown">Link 2</a>
        <a href="#" id="item3">Link 3</a>
        <a href="#" id="item4">Link 4</a>
        <a href="#" id="item5">Link 5</a>
        <a href="#" id="item6">Link 6</a>
        <a href="#" id="item7">Link 7</a>
    </div>
</div>

JQuery的:

var $default    = $('#item2').clone(true);
var $shared     = $('#item3').clone(true);
var $standard = $('#item4').clone(true);
var div = '<div class=\'dropdown-menu\'><span class=\'dropdown-box\'></span></div>';
$('.barline a#item2').remove();
$('.barline a#item3').remove();
$('.barline a#item4').remove();
$('.barline').find('a:nth-child(1)').after(div);
$('.dropdown-menu').prepend($default);
$('.dropdown-box').append($shared);
$('.dropdown-box').append($standard);

$(".barline").on("click", "#item2", function() {
 $(this).next('.dropdown-box').toggleClass('show');
});

以下是我的代码: jsfiddle

点击事件无效。

1 个答案:

答案 0 :(得分:0)

你的div-html中没有类'barline'。或者我们需要更多代码来回答这个问题。

<强>更新 实际你的JS切换类,但这个类没有效果。 你的css缺少一个“.show”类,它将dropbox设置为display:例如block。