jQuery - 點擊按鈕時添加字符串

快速簡單的問題，任何人誰知道一個小jQuery。jQuery - 點擊按鈕時添加字符串

$(document).ready(function(){ 
    $('.selected').on('click', function(){

我有一個導航菜單，有一個類添加到每個鋰元素點擊時（類'選擇'被添加）。我試圖改變文本的另一個容器內的導航下面使用replaceWith（帶class =「大旗頭」），即

$('.banner-header').replaceWith('Eugene is too cool for school');

但是我卡住，因爲文本具有取決於它的導航菜單上的改變項目正在按下。我可以寫一篇冗長的if語句，但我不知道從哪裏開始，請幫忙！

在此先感謝。

來源

2017-02-10 erayner

如果你的導航結構是這樣的：

<ul class="navigation"> 
    <li>Nav 1</li> 
    <li>Nav 2</li> 
    <li>Nav 3</li> 
</ul> 

<div class="banner-slider">Default Text</div>

你能夠使用此腳本：

$(document).ready(function(){ 
    $('.navigation li').on('click', function(e){ 
     $('.banner-slider').html($(e.target).html()); 
    }) 
});

檢查此demo。

來源

2017-02-10 03:19:21

真棒，愛的簡單。想知道你是否可以向我解釋（e）？ – erayner

也是什麼如果我想定製我想說的，而不是從導航顯示文本？例如，如果用戶點擊「導航1」，我想「你點擊導航一個」來顯示？ – erayner

'e'用於'event'，負責收集事件數據。它是可選的，但是如果您想獲取事件數據，則必須將其傳遞給事件關閉。在這種情況下，你想知道點擊了哪個'li'，'event.target'就是你需要的。 –

你可以做這樣的事情：https://jsfiddle.net/jLvppk3f/

HTML：

<ul> 
    <li class="menu" data-banner-text="A SELECTED"><a>A</a></li> 
    <li class="menu" data-banner-text="B SELECTED"><a>B</a></li> 
    <li class="menu" data-banner-text="C SELECTED"><a>C</a></li> 
    <li class="menu" data-banner-text="D SELECTED"><a>D</a></li> 
</ul> 
<div class="banner-header"> 
    TEST 
</div>

JS：

$(document).ready(function(){ 
    $('.menu').on('click', function() { 
     $('.menu').removeClass('selected'); 
     $(this).addClass("selected"); 
     $('.banner-header').text($(this).data('banner-text')); 
    }) 
});

來源

2017-02-10 03:06:23 mhshimul

jQuery - 點擊按鈕時添加字符串

回答

相關問題