Question

如何更新JavaScript（或jQuery）中单选输入元素的标签？例如，将文本从“ Swift”更改为“ Python”

<label for="language">
  <input type="radio" id="language" name="language" value="main">Swift
</label>

Answer 1

如果重新排列HTML，则可以定位标签并更改文本。

HTML

<input type="radio" id="language" name="language" value="main">
<label for="language">Swift</label>

jQuery JS

$('label[for="language"]').text('Python');

标准JS

var find = document.querySelectorAll('label[for="language"]');
if (find.length>0) {
    find[0].innerText = 'Python';
}

如果您不能或不想重新排列HTML，则可以用<span>元素包装文本并将其定位。

具有跨度的HTML

<label for="language">
    <input type="radio" id="language" name="language" value="main"><span>Swift</span>
</label>

带有Span的HTML的jQuery JS

$('label[for="language"] span').text('Python');

带有Span的HTML的标准JS

var find = document.querySelectorAll('label[for="language"] span');
if (find.length>0) {
    find[0].innerText = 'Python';
}

如果您根本无法编辑HTML，则可能需要复制单选按钮，以便一旦决定在其旁边显示什么文本就可以将其放回到元素中。

HTML

<label for="language">
   <input type="radio" id="language" name="language" value="main">Swift
</label>

JQuery JS

var find = $('label[for="language"]');
var html = find.html();
var regex = /(<([^>]+)>)/ig;
var radioButton = html.match(regex)[0];
find.html(radioButton + 'Python');

标准JS

var find = document.querySelectorAll('label[for="language"]');
var html = find[0].innerHTML;
var regex = /(<([^>]+)>)/ig;
var radioButton = html.match(regex)[0];
find[0].innerHTML = radioButton + 'Python';

更新标签单选输入

1 个答案: