jQuery的方式從字符串

我有一個生成的導航替換字符時，前n項有_在他們面前永遠是在列表的頂部。我現在想要完成的是從網站的前端刪除_。jQuery的方式從字符串

我試圖與jQuery代碼低於幾乎工作要做到這一點，但它也正在改變其他導航項目的文本。

參見JS提琴全加價：https://jsfiddle.net/1fz661o4/

代碼：

$(function() { 
    $('.dropdown-submenu').html($('.dropdown-submenu').html().replace(/\_/g,'')); 
});

來源

2016-11-17 mrwhynot

你需要什麼？您的代碼按預期工作。「其他導航項目」需要通過ID或不同的類名來標識，因此您只能替換所需導航中的「_」。 –

@MarcosPérezGude如果你看看輸出結果，你會看到，「Software One」和「Software Two」現在都在替換後顯示爲「Software One」。 – mrwhynot

「Software One」和「Software Two」的混合問題很容易解決。您正在用jQuery創建的自動循環直接替換。如果你使用你自己的循環並用'$（this）'取出當前元素，問題就會消失。 –

你可以只將其更改爲環比錨。

$(function() { 
    $('.dropdown-submenu > a').each(function() { 
     $(this).text($(this).text().replace(/\_/g, '')); 
    }); 
});

https://jsfiddle.net/utk12jdt/1/

來源

2016-11-17 16:47:41 Turv

您附加的鏈接是共享OP的相同。我編輯它。 –

這工作但引入了第二個問題。在我最初的問題中，我的導航中沒有獨立的項目，所以'dropdown-submenu'類工作。但現在我跑了這個，我意識到沒有孩子的導航項目沒有'dropdown-submenu'類生成。所以這會忽略這些。這裏是更新的小提琴：https://jsfiddle.net/95ezLehx/ – mrwhynot

改爲在整個下拉菜單中查看所有錨鏈接，'.dropdown a'請參閱https://jsfiddle.net/ snaazdad/1/ – Turv

你需要讓你的選擇更具體。要麼給它一個獨特的類或ID，並根據它進行選擇。

<ul class="dropdown-submenu my-custom-menu">

而jQuery的將變爲：

$(function() { 
    var menu = $('.my-custom-menu'); // save the query since we use it twice 
    menu.html(menu.html().replace(/\_/g,'')); 
});

注：您使用id小號不正確，因爲他們註定是全局唯一的。你不應該有id="row"多次。這就是課程的目的。

來源

2016-11-17 16:45:06 Soviut

roger那。我忘了提及我沒有控制class/id的生成。這是從我使用的CMS自動生成的。 SparkPay具體。 – mrwhynot

如果您只想更改單個項目，您將使用一個ID。在這種情況下，OP已經正確使用一個類來選擇所有相關的元素。 –

@ freedomn -m OP提到他們的jquery選擇器不夠具體，影響了他們不想要的菜單。一個ID可以使它更具體。 – Soviut

因此，基本上你只想刪除.dropdown-submenu的直接子女錨中的下劃線？在你的小提琴，用$('.dropdown-submenu > a')更換$('.dropdown-submenu')。

的jsfiddle：https://jsfiddle.net/26qLofz8/

$(function() { 
     $('.dropdown-submenu > a').html($('.dropdown-submenu > a').html().replace(/\_/g,'')); 
});

編輯：

你的迴應之後，現在的問題是顯而易見的。爲了防止您的<li>的所有成爲軟件之一，您將需要循環所有你想要替換，像這樣的元素：

$(function() { 
    $('.dropdown-submenu > a').each(function(i, el) { 
     $(el).html($(el).html().replace(/\_/g,'')); 
    }); 
});

的jsfiddle： https://jsfiddle.net/n7ms67k0/

來源

2016-11-17 16:47:06

你有沒有跑過你的小提琴？與原始文件完全一樣，並且具有完全相同的問題（_Software Two成爲Software * One *） –

在發佈評論時沒有看到該評論。將編輯。 –

可以使用.html()超載與提供現有的HTML功能：

$('.dropdown-submenu').html(function(index, html) { return html.replace(/\_/g,''); });

更新小提琴：https://jsfiddle.net/1fz661o4/2/

或者，你也可以遍歷每個記錄：

$('.dropdown-submenu').each(function() { 
    $(this).html($(this).html().replace(/\_/g,'')); 
});

來源

2016-11-17 16:47:31

您的解決方案都能正常工作，但引入了另一個問題。現在我跑了，我意識到沒有孩子的導航項目沒有'dropdown-submenu'類生成。所以這會忽略這些。這裏是更新的小提琴：https://jsfiddle.net/95ezLehx/ – mrwhynot

簡單地替換HTML將刪除所有事件偵聽器，並且還可能導致未來的問題，如果你有在URL等下劃線的鏈接

你應該做的是通過元素並改變文本節點的值。我不確定如何在jQuery中可靠地做到這一點，但這裏是你如何使用普通的JavaScript DOM來做到這一點。

function replaceUnderscore(index, el) { 
    switch (el.nodeType) { 
    case 3: // text node 
    el.nodeValue = el.nodeValue.replace(/_/g, ''); 
    break; 

    case 1: // normal element 
    for (var i = 0, child; child = el.childNodes[i]; i++) { 
     replaceUnderscore(i, child); 
    } 
    break; 
    } 
}

若要將此你jQuery中找到的元素，你只是做

$('.class').each(replaceUnderscore);

沒有測試，但我認爲這應該工作。

這就是說，你必須在JavaScript中做到這一點？理想情況下，這種類型應該在服務器端執行。如果它是一個CMS，您可能可以爲此編寫一個小插件。

來源

2016-11-17 16:49:07

您必須通過.dropdown子菜單類使用jQuery每個函數來檢查每個元素，因此一次只會影響一個元素。你的JavaScript代碼看起來像這樣。

$(".dropdown-submenu").each(function() { 
    //this is the current .dropdown-submenu element 
    $(this).html($(this).html().replace(/\_/g,'')); 
});

來源

2016-11-17 16:59:16

jQuery的方式從字符串

回答

相關問題