使用单选按钮进行URL导航

时间:2013-04-22 15:41:26

标签: javascript jquery html radio-button url-routing

我是JS和Jquery的新手,我试图找到一种方法,使用条件导航来使用单选按钮进行URL。

我的表单中有两个选项用于选择条件,另一个用于选择匹配的是/否。

根据所做的单选按钮选择,我必须提供这些报告的URL,例如Param2 + No = Report 1 URL等。

有没有办法通过以下代码实现这一目标:

<!DOCTYPE html>
<html>
<body>
  <form name="formone" id="optionsform">
    <fieldset>
      <p><b>Selection Criteria</b></p>
<label><input type="radio" name="group1" id="ac-yes" value="1">Param1</label>
<label><input type="radio" name="group1" id="ac-no" value="0">Param2</label>
  <p><b>Auto Matching</b></p>
<label><input type="radio" name="group2" id="bt-yes" value="2">Yes</label>
<label><input type="radio" name="group2" id="bt-no" value="0">No</label>
  <p></p>
<a href="varible-address">Go</a>
</fieldset>
</form>
<script>
    $(function(){
      var urls = new Array();
      urls[0]="Report 1 URL";// no + no
      urls[1]="Report 2 URL";// yes + no
      urls[2]="Report 3 URL";// no + yes
      urls[3]="Report 4 URL";// yes + yes

      $('input[type=radio]').click(function(){
        var score = 0;
        $('input[type=radio]:checked').each(function(){score+=parseInt($(this).val())});) before the the curly bracket
        $('a').attr('href',urls[score]);
      });) and ;
   });
</script>
</body>
</html> 

如果有人能告诉我如何使用Go按钮而不是这个Link href。

,我也会合适

如果无法做到这一点,我们可以改用Javascript吗?

这是JSbin:http://jsbin.com/emaxev/1/edit

请告知。

提前致谢。

-V

1 个答案:

答案 0 :(得分:0)

您的脚本似乎有一些错误的已关闭)和未注释掉的文字。

修复它并且功能正常

$(function () {
    var urls = new Array();
    urls[0] = "Report 1 URL"; // no + no
    urls[1] = "Report 2 URL"; // yes + no
    urls[2] = "Report 3 URL"; // no + yes
    urls[3] = "Report 4 URL"; // yes + yes

    $('input[type=radio]').click(function () {
        var score = 0;
        $('input[type=radio]:checked').each(function () {
            score += parseInt($(this).val());
        });
        $('a').attr('href', urls[score]);
    });
});

FIDDLE:http://jsfiddle.net/Spokey/RyQuj/1/

如果您想使用<button>按钮。

<button>Go</button>