jquery - 从单选按钮获取值并添加 url

Question

我有一个带有单选按钮的列表。当用户检查单选按钮时，它会获取单选按钮的值并将其添加到 url。如何完成此功能？以下是我的简单代码。但这不起作用。请帮助我，请。

<script type="text/javascript">
$(document).ready(function($){
    var val = $(':radio[name=rdo_1]:checked').val();
    $('#button').click(function(){
        document.location.href = 'http://localhost/test/val1.html';

    });
});
</script>

Answer 1

你可以像这样发送参数

<script type="text/javascript">
$(document).ready(function($){
    var val = $(':radio[name=rdo_1]:checked').val();
    $('#button').click(function(){
        document.location.href = 'http://localhost/test/val1.html?radio_button_value='+val

    });
});
</script>

Answer 2

您希望按钮单击处理程序中的 var 分配。如果不这样做，它将在加载时分配，任何更改都不会影响功能。

$(function() {
    $('#button').click(function(){
        var val = $(':radio[name=rdo_1]:checked').val();
        document.location.href = 'http://localhost/test/val1.html?radio_button_value=' + val
    });
});

注意：我还使用了 document ready 的速记版本。

Answer 3

尝试以下

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

    $('#button').click(function(){
        var val = $('input[type=radio][name=rdo_1]:checked').val();
        var url="http://localhost/test/"+val+".html";
        window.location.href = url;

    });
});
</script>

Answer 4

使用<input type="submit"/>附带<form method="get"> </form>

示例如下所示。

但不要忘记添加名称字段

<form action="http://localhost/test/val1.html?" method="get" name="f">
    <input type="text" name="user" />
    <input type="checkbox" name="name1" />
    <input type="submit" class="login_button" value="LOGIN">
</form>

最好不要使用 javascript

Answer 5

$(document).ready(function($){
      $('#button').click(function(){
          var val = $(':radio[name=rdo_1]:checked').val(); 
          document.location.href = 'http://localhost/test/val1.html?radio='+val; 
      });
});

Answer 6

jQuery：

$('input[@name="NAME"]:checked').val();

javascript:

var radios = document.getElementsByName('NAME');

for (var i = 0, length = radios.length; i < length; i++) {
if (radios[i].checked) {
    alert(radios[i].value);
}
}