Question

我正在做一个报价网站，我想如果用户想要查看最近的报价按下单选按钮，页面将显示最近的报价。我无法弄明白如何让收音机盒发送到某个页面。

<input type="radio" name="order" id="noi" value="noi">
<label for="noi">Most Recent</label>
<input type="radio" name="order" id="vechi" value="vechi" >
<label for="vechi">Most Old</label>
<input type="radio" name="order" id="aprec" value="aprec" >
<label for="aprec">Most Liked</label>

Fiddle

我想制作像this这样的东西，但不需要按下提交按钮，但是当选中单选框时会自动发送到链接。不知道这是否正确，但我已经看到其他网站这种类型。

这可能没有javascript或jquery吗？

Answer 1

http://jsfiddle.net/ryBs6/47/ - 更新jsfiddle

$("input[type='radio']").on("click",function(){window.open($(this).attr("href"))})

无论如何这会起作用，因为如果我右键单击并在新选项卡中打开链接它可以工作，但单击无法工作，我不知道这是否因安全原因或什么而被禁用！

http://jsfiddle.net/prollygeek/6vCdX/

<a href="http://www.google.com"><input type="radio" name="order" id="noi"  value="noi"></a>
    <label for="noi">Most Recent</label>

Answer 2

如果你真的不想使用Javascript，请尝试将输入和标签包装在一个锚中

<a href="http://google.com"><input type="radio" /></a>

如果你想使用一些javascript，请执行

<input onclick="window.open('http://google.com');" />

或者，如果您不想使用onclick属性，请使用ProllyGeek的答案（我最喜欢他的答案）：

$("input[type='radio']").on("click",function(){window.open($(this).attr("href"))})

Answer 3

 <input type="radio" data-href='https://www.google.co.in/?gfe_rd=cr&ei=9l5FU5L8C6KL8QfOz4GABA' name="order" id="noi" value="noi">
    <label for="noi">Most Recent</label>
     <input type="radio" data-href='https://www.google.co.in/?gfe_rd=cr&ei=9l5FU5L8C6KL8QfOz4GABA' name="order" id="vechi" value="vechi" >
    <label for="vechi">Most Old</label>
    <input type="radio" data-href='https://www.google.co.in/?gfe_rd=cr&ei=9l5FU5L8C6KL8QfOz4GABA' name="order" id="aprec" value="aprec" >
    <label for="aprec">Most Liked</label>

这应该是你的HTML

$('input[type='radio']').click(function()
                 {

                 window.location=$(this).attr('data-href')
                 });

你在这里

<强> Demo

现在没有javascript或jquery

<a href="http://stackoverflow.com"><input type="radio" name="order" id="vechi" value="vechi" ></a>

Answer 4

   <script>
    $(function(){
        $("input").change(function() {
           if(this.checked) {
             window.location = this.value;
          }
      });
    });
    </script>


    <input type="radio" name="order" id="noi" value="http://stackoverflow.com">
    <label for="noi">Most Recent</label>
    <input type="radio" name="order" id="vechi" value="http://stackoverflow.com" >
    <label for="vechi">Most Old</label>
    <input type="radio" name="order" id="aprec" value="http://stackoverflow.com" >
    <label for="aprec">Most Liked</label>

FIDDLE DEMO

Answer 5

没有jquery：

var inputs = document.getElementsByTagName('input');

Array.prototype.forEach.call(inputs, function(item){
    item.addEventListener('change', function(e){;
        location.href = e.srcElement.value; // Redirect to value
    });
});

如果选中了收音机框，请转到链接

5 个答案:

现在没有javascript或jquery