仅更改或转换单选按钮的文本，而不是表单中的值答案

【问题标题】：Change or convert only text of radio buttons but not the values in form仅更改或转换单选按钮的文本，而不是表单中的值
【发布时间】：2013-08-30 16:41:14
【问题描述】：

下面是我的代码：

<form name="mainform" id="mainform" class="form_step" action="" method="post" enctype="multipart/form-data">
<ol>
<li id="list_cp_ad_type">
  <div class="labelwrapper">
     <label>
           <a href="#" tip="Choose your ad type" tabindex="999" title="Choose your ad type">
              <div class="helpico"></div>
                </a>Ad Type: <span class="colour">*</span>
     </label>
  </div>
        <ol class="radios">
        <li><input value="Offer Ads" type="radio" class="radiolist required" name="cp_ad_type" id="cp_ad_type">&nbsp;&nbsp;Offer Ads</li>
        <li><input value="Wanted Ads" type="radio" class="radiolist required" name="cp_ad_type" id="cp_ad_type">&nbsp;&nbsp;Wanted Ads</li>
        </ol>
        <div class="clr"></div>
</li>

预期代码：

<form name="mainform" id="mainform" class="form_step" action="" method="post" enctype="multipart/form-data">
<ol>    
    <li id="list_cp_ad_type">
                <div class="labelwrapper">
                        <label>
                            <a href="#" tip="Choose your ad type" tabindex="999" title="Choose your ad type">
                            <div class="helpico"></div>
                             </a>Ad Type: <span class="colour">*</span>
                       </label>
                </div>
               <ol class="radios">
               <li><input value="Offer Ads" type="radio" class="radiolist required" name="cp_ad_type" id="cp_ad_type">I Offer this</li>
               <li><input value="Wanted Ads" type="radio" class="radiolist required" name="cp_ad_type" id="cp_ad_type">I Want this</li>
               </ol>
               <div class="clr"></div>
    </li>

我只想将“Offer Ads”文本转换或更改为“I Offer this”文本，并将“Wanted Ads”文本转换或更改为“I Want this”文本，而不是 id="cp_ad_type" 的输入值对页面加载立即生效。

任何人请帮助我..

【问题讨论】：

ID 必须是唯一的。
很抱歉，您的问题不是很清楚。您想如何更改文本 - 通过 jQuery？你是什么意思：“对页面加载也有直接影响”？

标签： javascript jquery html forms radio-button

【解决方案1】：

试试

jQuery(function(){
    $('.radios input:radio[value="Offer Ads"]').get(0).nextSibling.data  = 'I offer this'
    $('.radios input:radio[value="Wanted Ads"]').get(0).nextSibling.data = 'I Want this'
})

演示：Fiddle

【讨论】：

【解决方案2】：

我假设您在标记它时使用的是jQuery。这可能对你有用，

$('input:radio[value="Offer Ads"]').parent().text('I Offer this');
$('input:radio[value="Wanted Ads"]').parent().text('I Want this');

JSFiddle.

不过，我建议为每个元素使用不同的id，否则它将不是有效的 HTML。引用 W3C 文档：

一个文档中不能有多个元素具有相同的 id 值。

【讨论】：

【解决方案3】：

ID 应该是唯一的，为每个单选按钮分配唯一的 ID，或者改用类

试试这个

function change()
{
document.getElementById('cp_ad_type').setAttribute('value',"your value");

}

【讨论】：