javascript - input radio属性默认为选中状态,为什么页面刷新后,显示的效果却不是选中的呢?
代言
代言 2017-06-12 09:24:03
[JavaScript讨论组]

  • 这里是默认显示的内容

默认进来后的显示效果应该是这样的:

现在却是这样,没有被选中的:

我查看过input的属性 :checked>,为什么刷新之后,就不显示了呢?只有再点击label隐藏的内容才会显示?

我没有写js,都是css。

谢谢!

代言
代言

全部回复(2)
给我你的怀抱

感谢 djyuning :

 你说的对,是需要js控制的。
 
$(document).ready(function() {
    var checkedName = $('#tab-system-1');
    isChecked(checkedName);
}


function isChecked(name){
    var checkedTrue = name.checked ? true : false;
    if(checkedTrue == false){
        name.attr('checked','true');
    }else{
        name.attr('checked','false');
    }
}
我想大声告诉你

没太理解你的HTML结构,在我认为,顶部的按钮和底部内容应该是平行的,你的却是垂直的。

另外,只要设置了相同的name一个,input:radio就是可以自动切换选中,你的脚本再更改选中就无意义了。

获取状态$(#selector)[0].checked,,注意这里的[0],需要把jQuery 对象转为Dom 对象读取属性!

是prop(name,bool),不要用attr!

说下解决方案,
首先,你需要为第一个input添加checked属性,让它在页面加载时就是存在选中状态的。
然后,你需要用js建立一个监听方法,该方法用于遍历所有的input状态。
接下来,你需要为input绑定change事件,值变化时再遍历一遍状态。
最后,如果你希望点击后,再次刷新页面仍然高亮在刚才点击的位置,那么你可能需要用到cookie插件了。
原理,页面加载完成,初始化遍历一遍,表单选中,再遍历一遍。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号