如何更新模板單選按鈕

是否有一種使用JQuery更新「描述」的優雅方式？如何更新模板單選按鈕

<div> 
    <div class="radio"> 
     <label> 
      <input name="somename" type="radio">description 
     </label> 
    </div> 
    <div class="well"> 
     <div class="line">Something</div> 
     <div class="line">Something else</div> 
    </div> 
</div>

我已經嘗試過標籤上的文字（'新描述'），但輸入也被刪除了。有沒有在我的JavaScript序列化HTML解決方案？

jsfiddle

我試圖實現是在HTML源代碼，我可以克隆，更新和動態追加一個模板單選按鈕。我不確定是否有更好的模式可以實現動態的選擇列表。

來源

2015-07-10 chrisvdb

如何在''標籤中輸入後面的文字？ – j08691

@chrisvdb如果你不能改變標記，你可以這樣做。 https://jsfiddle.net/fxL0xyw1/我會說，雖然我不太喜歡這個解決方案。 – bassxzero

給你：只需使用label for

$('#somelabel').text('new description');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <div class="radio"> 
 
    <input name="somename" type="radio"> 
 
    <label id='somelabel' for="somename">description</label> 
 
    </div> 
 
    <div class="well"> 
 
    <div class="line">Something</div> 
 
    <div class="line">Something else</div> 
 
    </div> 
 
</div>

希望這有助於。

來源

2015-07-10 03:06:36 hungndv

看來OP不能改變HTML。 –

我可以更改HTML，所以此解決方案完美工作。謝謝！ – chrisvdb

將其圍繞一個跨度，然後更新跨度中的文本。像這樣

<div> 
    <div class="radio"> 
     <label> 
      <input name="somename" type="radio"><span id="needsUpdate">description</span> 
     </label> 
    </div> 
    <div class="well"> 
     <div class="line">Something</div> 
     <div class="line">Something else</div> 
    </div> 
</div>

然後JavaScript的

$('#needsUpdate').text('new description');

來源

2015-07-10 03:02:40 MrMadsen

寫完這篇文章後，我看到@ j08691在評論中提出了它。他應該將其作爲答案張貼，並且應該被接受。 – MrMadsen

看來OP不能更改HTML。 –

聰明的解決方案...應該有這個想法！謝謝！ – chrisvdb

你可以使用this.nodeType === 3，但我不會推薦它，除非你真的不能更改HTML來包裝一個跨度的文本。

$('label') 
 
    .contents() 
 
    .filter(function() { 
 
    return this.nodeType === 3 && $(this).index() != 0; 
 
    }).replaceWith('New text');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div> 
 
    <div class="radio"> 
 
     <label> 
 
      <input name="somename" type="radio">description 
 
     </label> 
 
    </div> 
 
</div>

來源

2015-07-10 03:05:37

如何更新模板單選按鈕

回答

相關問題