彈出式內容中的自舉切換按鈕彈出內容不工作

我做了一個jsFiddle我在哪裏使用twitter引導切換按鈕&彈出。彈出式內容中的自舉切換按鈕彈出內容不工作

HTML：

<div class="btn-group btn-toggle"> 
    <button class="btn btn-sm btn-info">On</button> 
    <button class="btn btn-sm btn-primary active">Off</button> 
</div> 

<button id="popbutton" class="btn btn-lg btn-warn">pop up</button>

JS：

var popupElement = '<div class="btn-group btn-toggle"><button class="btn btn-sm btn- info">On</button><button class="btn btn-sm btn-primary active">Off</button></div>'; 

$('#popbutton').popover({ 
    animation: true, 
    content: popupElement, 
    html: true 
}); 


$('.btn-toggle').click(function() { 
    $(this).find('.btn').toggleClass('active'); 

    if ($(this).find('.btn-primary').size() > 0) { 
     $(this).find('.btn').toggleClass('btn-primary'); 
    } 
    if ($(this).find('.btn-danger').size() > 0) { 
     $(this).find('.btn').toggleClass('btn-danger'); 
    } 
    if ($(this).find('.btn-success').size() > 0) { 
     $(this).find('.btn').toggleClass('btn-success'); 
    } 
    if ($(this).find('.btn-info').size() > 0) { 
     $(this).find('.btn').toggleClass('btn-info'); 
    } 

    $(this).find('.btn').toggleClass('btn-default'); 

});

的切換按鈕的作品，但是當我用酥料餅內同一按鈕，它不會工作。

請建議一種方法。

來源

2014-07-18 Nayana_Das

在的jsfiddle有一個控制檯錯誤'未捕獲的SyntaxError：意外的標記; '，雖然我不確定這是否與 – Dan

@丹不同，它與該錯誤無關。 – ProllyGeek

因爲你的酥料餅的按鈕不存在在加載時你需要使用事件委託。此外，而不是size()（被棄用的jQuery 1.8的），你應該使用length屬性：

$('body').on('click','.btn-toggle',function() { 
    $(this).find('.btn').toggleClass('active'); 

    if ($(this).find('.btn-primary').length > 0) { 
     $(this).find('.btn').toggleClass('btn-primary'); 
    } 
    if ($(this).find('.btn-danger').length > 0) { 
     $(this).find('.btn').toggleClass('btn-danger'); 
    } 
    if ($(this).find('.btn-success').length > 0) { 
     $(this).find('.btn').toggleClass('btn-success'); 
    } 
    if ($(this).find('.btn-info').length > 0) { 
     $(this).find('.btn').toggleClass('btn-info'); 
    } 

    $(this).find('.btn').toggleClass('btn-default'); 
});

Updated fiddle

來源

2014-07-18 16:23:18

非常感謝你的努力！這工作完美。 –

感謝它的工作...... –

這是你應該怎麼做，如果你要添加新的元素，你的頁面：

$('body').on('click','.btn-toggle',function() { 

       $(this).find('.btn').toggleClass('active'); 

       if ($(this).find('.btn-primary').length > 0) { 
        $(this).find('.btn').toggleClass('btn-primary'); 
       } 
       if ($(this).find('.btn-danger').length > 0) { 
        $(this).find('.btn').toggleClass('btn-danger'); 
       } 
       if ($(this).find('.btn-success').length > 0) { 
        $(this).find('.btn').toggleClass('btn-success'); 
       } 
       if ($(this).find('.btn-info').length > 0) { 
        $(this).find('.btn').toggleClass('btn-info'); 
       } 

       $(this).find('.btn').toggleClass('btn-default'); 

      });

這裏是一個小提琴：

http://jsfiddle.net/prollygeek/ZVak6/5/

來源

2014-07-18 16:21:23 ProllyGeek

非常感謝您的幫助，這也很完美。 –

彈出式內容中的自舉切換按鈕彈出內容不工作

回答

相關問題