1

我想根据单选按钮的选择更改标签文本。你能帮我轻松完成吗？这是我的代码。

<div class="control-group "> 

            <div class="controls">
              <label class="radio inline">
                   <input type="radio" name="btype[]" id="private" value="private" checked>Private
              </label>
              <label class="radio inline">
                    <input type="radio" name="btype[]" id="business" value="business">Business Advertiser
              </label>
            </div>
    </div>

这是我要更改文本的标签

<div class="control-group " > 
          <label class="control-label" id="labelName">Name</label>
            <div class="controls">
              <div class="input-prepend">
                <span class="add-on"><i class="icon-user"></i></span>
                <input type="text" class="input-xlarge" id="name" name="name" placeholder="">

              </div>
            </div>
    </div>

    <div class="control-group ">
          <label class="control-label" id="labelNum">NIC</label>
            <div class="controls">
              <div class="input-prepend">
                <span class="add-on"><i class="icon-user"></i></span>
                <input type="text" class="input-xlarge" id="regNum" name="regNum" placeholder="">

              </div>
            </div>
    </div>

这是我的 javascript

 <script type="text/javascript">
          $(document).ready(function()
          {

             if (($('input[name=btype]:radio:checked').val())=="business") 
             {
               document.getElementById("labelName").innerHTML="Company Name";
               document.getElementById("labelNum").innerHTML="Reg No.";
             }
          }
        );
        </script>
4

4 回答 4

1

我以更好的方式为您重写了代码。当你有 jQuery 时，最好使用它。不要被处理 JavaScript 搞砸了。jQuery 可以为你做这件事。

<script type="text/javascript">
          $(document).ready(function()
          {
             if ($('#business').is(':checked')) 
             {
               $('#labelName').text("Company Name");
               $('#labelNum').text("Reg No.");
             }
          }
        );
</script>
于 2013-07-22T05:58:02.023 回答
0

提琴手

onclick="document.getElementById('labelName').innerHTML='NEWLABELNAME'"
于 2013-07-22T06:00:42.700 回答
0

您可以通过向该输入添加更改侦听器并获取所选输入的值来实现此目的

我添加了一些 HTML5 属性以避免获取更多 DOM 请查看data-text

<div class="control-group "> 

            <div class="controls">
              <label class="radio inline">
                   <input type="radio" data-text="private" name="btype[]" id="private" value="private" checked>Private
              </label>
              <label class="radio inline">
                    <input type="radio" data-text="Business Advertiser" name="btype[]" id="business" value="business">Business Advertiser
              </label>
            </div>
    </div>

这是你的 JS 和它的 jQuery

$(document).ready(function(){
    $('input[name="btype[]"]').change(function(){
        alert($(this).data('text')); 
    }); 
});

您可以添加更多data-*属性，例如价格或任何您想要的，并通过使用来获得它的价值$(this).data('*');

像这样使用它来使您的 HTML 有效，我用它来避免获取父文本

检查这个小提琴http://jsfiddle.net/gK6bU/1/

我希望这可以帮助:)

于 2013-07-22T06:01:22.033 回答
0

你将 jquery 与你的 js 混合在一起，所以这里是 jquery

<script type="text/javascript">
  $(document).ready(function(){
    $('input[name=btype]:radio:checked').click(function(e){
      if($(e.currentTarget).val()==='business') {
        $("#labelName").text("Company Name");
        $("#labelNum").text("Reg No.");
      }
    });
  });
</script>
于 2013-07-22T05:58:22.187 回答