如何在加载新页面时启用jquery标签/单选按钮

时间:2016-09-28 07:16:39

标签: javascript jquery codeigniter

我的codeigniter网站有如下参数男性和女性。 route.php已完成。

http://localhost/males
http://localhost/female

view.php有两个标签。

<li>
  <div class="btn-group" data-toggle="buttons">
    <label class="btn btn-default gender-label" id="lbl-female">
       <input type="radio" name="options" id="option1" autocomplete="off">
           <span>Females</span>
    </label>
    <label class="btn btn-default gender-label" id="lbl-male">
     <input type="radio" name="options" id="option2" autocomplete="off">
         <span>Males</span>
      </label>
  </div></li>   

加载页面http://localhost时会出现两个标签。当用户点击女性时,它将重定向到http://localhost/females。但是没有选择新的页面女性标签。新页面栏具有相同的UI。当cleck并重定向到新页面时如何制作选定的收音机/标签。

<script type="text/javascript">
$(document).ready(function () {
    var genderSelect = "";
    $("#lbl-female").click(function () { 
        genderSelect = 'females';
        window.location.href = '<?php echo base_url(); ?>' + genderSelect; 
    });
    $("#lbl-male").click(function () { 
        genderSelect = 'males';      
        window.location.href = '<?php echo base_url(); ?>' + genderSelect;    
    }); }); </script>

3 个答案:

答案 0 :(得分:3)

由于你想在页面加载的任何一个上使用激活一个特定的单选按钮,所以请求uri

在你的Js中,你使用

<script type="text/javascript">
$(document).ready(function () {
   //use php to check here or js to check
     <?php 
      if($_SERVER['REQUEST_URI']=='male'){;
      ?>
         $("#option1").attr('checked',false);
         $("#option2").attr('checked',true);
       <?php }else{ ?>
         $("#option1").attr('checked',true);
         $("#option2").attr('checked',false);

       <?php }?>

    var genderSelect = "";
    $("#lbl-female").click(function () { 
        genderSelect = 'females';
        window.location.href = '<?php echo base_url(); ?>' + genderSelect; 
    });
    $("#lbl-male").click(function () { 
        genderSelect = 'males';      
        window.location.href = '<?php echo base_url(); ?>' + genderSelect;    
    }); }); </script>

顶部的php应该运行并在页面加载时执行任何jquery。我希望它有所帮助

答案 1 :(得分:0)

您可以在页面加载 -

上执行此操作
if(location.href.indexOf("males") >= 0) {
    $("#lbl-male").find("radio").attr("selected", "selected");
} else if (location.href.indexOf("females") >= 0) {
   $("#lbl-female").find("radio").attr("selected", "selected");
}

答案 2 :(得分:0)

如果我理解正确,您希望根据上次点击哪个无线电(重定向前)预先选择无线电盒,您将必须保留此选定值并根据您可以设置无线电的值

假设点击了女性收音机盒。

var female_radio = $('#lbl-female');
if( femaleRadioClicked === true)
female_radio.prop('checked', true);