jQuery的追加和刪除

我喜歡有一點點卡拉科特一個H3的標題，說「擴大我」jQuery的追加和刪除

它看起來就像是：類別XYZ [+]

我喜歡的jQuery的功能去chage /刪除+減去點擊..我知道如何將文本追加到字符串，但不是如何刪除它或只是一個部分..

如果你有更好的接觸隨時告訴我..謝謝！

注：實現.remplace功能......但如預期 you can see it here不工作...問題，我用的jQuery 1.4切換到1.4.3，現在它的工作！

2010-11-08 menardmam

好吧，如果你必須有+/-在同一H3作爲標題文本的其餘部分，我會用正則表達式替換它。下面是我該怎麼做：

$("body").delegate("#header a", "click", function(eventObj) { 
    if ($(this).text().match(/\+/)) { 
     $(this).text($(this).text().replace(/\+/, "-")); 
    } else { 
     $(this).text($(this).text().replace(/-/, "+")); 
    } 
});

你可以看到這個工作在jsFiddle。

來源

2010-11-09 00:01:00 Alex

好！這正是我需要的！：） – 2010-11-09 00:15:41

這是我選擇的答案，因爲它讓我學到了一些新東西，但在我的網站上它現在不起作用了......你能指出我的問題嗎？ – menardmam 2010-11-09 01:07:43

@ marc-andre menard問題在於，在您的網站上，您在h3中有一個錨標籤。所以你需要抓住主播的文字而不是h3的文字。我已經更新了我的答案以反映這一點。請嘗試。 – Alex 2010-11-09 02:05:59

$（「＃idOfObject」）。html（「[ - ]」）;

不要拍我，如果我錯了，通過內存:)

來源

2010-11-08 23:56:50 ajacian81

您可以使用jQuery的HTML或文本的功能來完成這個打算：

$("#your-selector").text("category xyz[-]");

來源

2010-11-08 23:57:54 jeremysawesome

把小角色，在它的非常擁有<span>，並給<span>一個「class」或「id」值。然後，您可以使用Javascript中的類或id來專門查找該文本的部分內容並對其進行更改。這將會帶來額外的優勢，使得這些文本在你的頁面內容中毫無意義，在語言清晰度方面都顯得自鳴得意，而且這個小角色只會是特別。它的生活質量將得到顯着提高，而這種事情真的會在潛意識層面上給用戶帶來。

來源

2010-11-08 23:59:11 Pointy

+1這個答案完全是瘋狂的，但如此真實。 – lonesomeday 2010-11-09 00:03:04

你選擇什麼方法來顯示「可能性」，通過舔一些東西來查看更多......給我展示一些你已經完成的網站的例子 – menardmam 2010-11-09 01:10:04

如果可改變的文本是帶有「id」的「」，那麼它可以很容易地改變。這是完全基本的網絡編程。 – Pointy 2010-11-09 03:59:28

把字符在跨越像

<span class=expandPlus>[+]</span>

，那麼你可以使用像

$("h3").click(function() { 
    $(this).children('expandPlus').html('[-]') 
    . 
    . 
    . 
});

來源

2010-11-09 00:00:17 generalhenry

只需切換現有元素的可視性就簡單多了。

HTML

<h3>Category XYZ 
    <span id="toggle"> 
     <a href="#" class="expand" title="expand me">[+]</a> 
     <a href="#" class="hide" title="hide me">[-]</a> 
    </span> 
</h3> 
<div id="toggleContent">This is the text of category XYZ</div>

的Javascript

$("span#toggle a").click(function() { 
    $("div#toggleContent").toggle(); 
    $("span#toggle a").toggle(); 
});

CSS

div#toggleContent { display: none; } 
span#toggle a.hide { display: none; }

JSFiddle你可以試試這個。

來源

2010-11-09 00:14:34 Damo

+1爲一個優雅和乾淨的解決方案。我就是這麼做的。 – Alex 2010-11-09 03:44:15

如果要展開/摺疊我建議你做一個結構類似這樣：

See this example on jsFiddle.

每個a是關係到一個div。 href是內容div的選擇器。

<div id="container"> 
    <ul> 
     <li>Category 01 <a href="#cat01">[+]</a></li> 
     <li>Category 02 <a href="#cat02">[+]</a></li> 
     <li>Category 03 <a href="#cat03">[+]</a></li> 
    </ul> 
    <br /> 
    <div id="categories"> 
     <div id="cat01">content 01</div> 
     <div id="cat02">content 02</div> 
     <div id="cat03">content 03</div> 
    </div> 
</div>

這裏我使用的是toggle，每次點擊的元素由1功能指數增加，直至達到最大，然後再回到0，所以有兩個功能，它會在每個人之間交替單擊。通過這樣做，您可以切換[-]和[+]。這隻會適當地假設所有類別都以相同的狀態開始。如果它們在第一次運行時不一定會崩潰，則必須修改此功能以檢查a內容[+]或[-]。

$("#container ul > li > a").toggle(function (e) { 
    var $this = $(this); 
    $this.text("[-]"); // change the text 
    // select content div using href as the selector 
    $($this.attr("href")).css("display", "block"); 
    // prevent any other behavior 
    e.preventDefault(); 
}, 
function (e) { 
    var $this = $(this); 
    $(this).text("[+]"); // switch to collapsed view 
    $($this.attr("href")).css("display", null); 
    e.preventDefault(); 
});

來源

2010-11-09 00:22:09 BrunoLM

jQuery的追加和刪除

回答

相關問題