如何使用选择菜单从单选按钮中删除禁用的属性答案

【问题标题】：How to remove disabled property from radio button with select menu如何使用选择菜单从单选按钮中删除禁用的属性
【发布时间】：2016-01-18 16:21:38
【问题描述】：

<script type='text/javascript' href='jquery.js'></script>
<script>
$(document).ready(function(){
	$('.selects').change(function(){
		$('.select').
	})
});
</script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!doctype HTML>

<input type='radio' id ='index1' value='1' name='radio1' disabled>radio button 1</input><br><br>
<select class='select' data-value='1'>	
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
</select><br><br>

<input type='radio' id ='index2' value='2' name='radio2' disabled>radio button 2</input><br><br>
<select class='select' data-value='2'>	
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
</select><br><br>

如何在选择菜单更改时从单选按钮中删除禁用属性？

<!doctype HTML>

<?php
$x = 1;
$y = 1;
while($x <= 2){
        echo "<input type='radio' id ='index$x' value='$x' name='radio$x' disabled>radio button $x</input><br><br>";
        echo "<select class='select' data-value='$x'>"; 
    while($y<= 4){  
        echo "<option>$y</option>";
        $y++;
    }
    echo "</select><br><br>";
    $x++;
    $y = 1; 
}
?>

<script type='text/javascript' href='jquery-2.1.4.min.js'></script>
<script>
$(document).ready(function(){
    $('.select').change(function(){
        var sel = $(this).attr('data-value');
        var selVal = $(this).val();
            if(selVal >= 3){
                $('#index'+sel).prop('disabled', false);
            }
        });
    });
</script>

When the select menu option value reaches 3 or above value, the disabled property from radio button will change to false.我也在下面尝试过这个脚本：

<script>
$(document).ready(function(){
    $('.select').change(function(){
        var sel = $(this).attr('data-value');
        if($( ".select option:selected" ) >= 3){
            $('#index'+sel).prop('disabled', false);
        }
    });
});
</script>

我在 href='jquery-2.1.4.min/js' 的代码中看到了一个印刷错误。我尝试替换它但仍然无法正常工作。我收到控制台错误 Uncaught ReferenceError: $ is not defined in line 6 which is $(document).ready(function(){

已编辑：提供的 Stack sn-p 转换为 html

【问题讨论】：

请提供输出 HTML，而不是 PHP 源代码。它使模型更容易创建。我讨厌在心里编译 PHP :)
我不明白你的问题。看来您的第一个代码块正在执行您想要的操作（更改其无线电 btn 的 disabled 属性），有什么问题？
是的，您的代码运行良好。你想达到什么目标？
我正在运行我的代码，但它似乎不起作用。 I have to set disabled property to false when the option value is >= 3
再次：请提供您页面的输出 HTML 以允许创建模型。由于 &%^$ PHP 的原因，我错过了多项选择 :)

标签： javascript jquery html

【解决方案1】：

prop('disabled') 可以采用布尔表达式生成true 或false，这将禁用或启用控件。

$(document).ready(function() {
  $('.select').change(function() {
    var sel = $(this).attr('data-value');
    var selVal = $(this).val();
    $('#index' + sel).prop('disabled', selVal < 3);
  });
});

JSFiddle： https://jsfiddle.net/TrueBlueAussie/wnLfxhLo/1/

注意：由于默认条目的无线电状态应禁用，您需要触发初始更改事件：

$(document).ready(function() {
  $('.select').change(function() {
    var sel = $(this).attr('data-value');
    var selVal = $(this).val();
    $('#index' + sel).prop('disabled', selVal < 3);
  }).change();
});

JSFiddle： https://jsfiddle.net/TrueBlueAussie/wnLfxhLo/2/

【讨论】：

你得到了最接近的一个伙伴 :) 但是它只在选择 2 时更改禁用道具，当我选择其他数字时它会变回禁用。我会试着看看这里似乎是什么问题。我想这应该很容易。谢谢顺便说一句
@chemical_elii：它在1 或2 上禁用，但我无法理解这个问题。我认为它也需要初始更新，因为您不是从禁用状态开始的。在答案中添加了change() 调用。