fmj.me

FMJ.me

一个靠自学的菜鸟,只会html+css,JavaScript是什么鬼?php?我靠,好高大上!

冯美杰就是我。单纯的个人博客,只做记录,别无其他。

Powered By Z-BlogPHP,Theme By zblog模板

当前位置:网站首页 技术学习 正文

点击不同的单选按钮(radio)出现不同的内容

FMJ发布于3年前 (2017-04-28) 1533 浏览 1 评论

写了一段时间的js了,TMD遇到一个问题还是得折腾半天...

今天给一个zblog模板增加了一个功能。前台的一个模块可以调用不同的数据,后台配置项里面用户可以选择,用的是单选按钮,不同的选项要出现不同的参数,于是用jq写了一个巨丑的代码(反正需求是实现了),代码如下:

html:

<p>
    <input id="list"  onclick="acheck1()" type="radio" name="list" value="1">选项1 
    <input id="list"  onclick="acheck2()" type="radio" name="list" value="2">选项2
</p>
<p class="box1"  style="display:none">点击第一个显示这里</p>
<p class="box2"  style="display:none">点击第二个显示这里</p>

js:

function acheck1(){
    $(".box1").show();
    $(".box2").hide();
}
function acheck2(){
    $(".box2").show();       
    $(".box1").hide();
}
$(function(){
    var list = $('#list:checked').val();
    if( list == 1){
        $(".box1").show();
    }
    if( list == 2){
        $(".box2").show();
       }
});

真特么暴力,真特么丑,按我这个进度或许要等个几年才能写出优雅的代码吧。。。


jq radio

已有1位网友发表了看法:

  • 147

    147  评论于 [2018-01-25 12:15:13]  回复

    acec1c0e4a6565f80bb18316df988604好的

欢迎 发表评论:

请填写验证码