【问题标题】:Radio button selection dynamically change other radio button value单选按钮选择动态更改其他单选按钮值
【发布时间】:2012-09-20 16:46:26
【问题描述】:

所以我试过寻找,但我没有找到任何东西,所以希望这不是一个重复的问题。我有几组单选按钮,我需要根据用户在第一组单选按钮中的选择动态更改与后一个单选按钮关联的值。

<input type="radio" name="length" id="6feet" value=" " >  6'0" 
<input type="radio" name="length" id="6.5feet" value=" " > 6'6"
<input type="radio" name="length" id="7feet" value=" " > 7'0"


<input type="radio" name="weight" ID="weight3" value="5" />  3 
<input type="radio" name="weight" ID="weight4" value="10" /> 4
<input type="radio" name="weight" ID="weight5" value="15" /> 5

<input type="radio" name="pieces" ID="PieceA" value="10">     2
<input type="radio" name="pieces" ID="PieceB" value="20">     3

所以我想弄清楚是否有一种方法可以使用 onClick 或类似的方法来设置它,以便当用户选择三个“长度”单选按钮之一时,它们将分别为重量和件数单选按钮也是如此。抱歉,如果问题完全不清楚。

【问题讨论】:

  • 有几种方法可以做到这一点,但 StackOverflow 的大多数人都希望看到一些尝试自己解决问题。作为开始的提示:创建一个对象,像树一样显示length 应该可用的值,然后显示每个length 应该可用的weight。然后,对于每个weight,显示应该可用的pieces。如果需要,请先将它们绘制成图表。您将根据这些数据更新屏幕。
  • @UmbraJoe,请选择您认为在有机会时回答了您的问题的回复。如果没有人这样做,请更新问题以获得更具体的答复。谢谢,

标签: javascript radio-button


【解决方案1】:

我没有完全理解你的问题..这是你需要的吗?

$(document).ready(function(){
    $('input[name=length]').click(function () {
        $('input[name=weight]').val(newValue);
        $('input[name=pieces]').val(newValue);        
    });
});

【讨论】:

    【解决方案2】:

    您是否需要this 之类的东西并为单选按钮重新分配一个真正的“值”?

    【讨论】:

      【解决方案3】:

      纯 javascript 解决方案看起来类似于:

      document.getElementById("6feet").onclick = (function() {
          document.getElementById("weight3").click();     
      });
      

      您将 onclick 事件附加到一个元素(在本例中是 id 为 6feet 的元素),一旦单击它就会调用定义的函数。

      阅读更多关于.click()

      EXAMPLE

      还有一些使用 jQuery 的更简单的解决方案,但我不确定您是否能够将它合并到您的代码中。

      【讨论】:

      • 或 document.getElementById("weight3").click()
      • click() 对OP来说可能更清楚,所以我将其更改为。谢谢
      • 我知道,但我已经习惯了使用 jQuery,所以我真的更喜欢它。
      猜你喜欢
      • 2015-02-27
      • 1970-01-01
      • 1970-01-01
      • 2016-07-26
      • 2018-01-31
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2010-11-22
      相关资源
      最近更新 更多