【click点击时间 _控制流程语句 _事件 】 | IT修真院·坑乎
问题已收录 click点击时间
我也踩过这个坑( 4 )
已统计您的踩坑,无需重复点击
回答(5)
控制流程语句 事件
详细描述
截图
代码
编辑于2024-11-21
  • [深圳|结业弟子]JS-许永坚
    3

    在for循环中创建的依附了class的元素(即带样式的<div>),无法在for循环外直接调用,  还是要重新获取一次。 

    我的思路: 先获取到所有的大格子和刀子,然后用  knife.hide()隐藏所有刀子。  在大格子的点击事件中使用$(this)确定为当前点击的格子,配合find获取大格子之下的到,并展示出来(PS:我这里的刀子在html的结构中是放在大格子内部的,如果你们是其他结构就使用其他的jq遍历函数寻找刀子)          

    playerId.click(function () {
       $(this).find(knife).show()
       ;//show当前大格子内部的刀子
       $(this).siblings().find(knife).hide()
       ;//隐藏所有兄弟格子内部的刀子
    });//main之下获取所有的大格子,并绑定大格子事件

      

    自问自答  点赞啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊

    蟹蟹!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!


    编辑于2019-08-17
  • [散修弟子]JS-1619
    0

    噗哈哈,楼上优秀

    编辑于2018-10-09
  • [上海|结业弟子]JS-燕赤霞
    0

    点击哪个哪个变色,然后点击事件的最前面充值颜色,我是这么做的

    $('.photo').click(function () {
    /* 重置一下存活状态盒子的颜色,如果你点了死者的盒子当然也是要重置的 */
    for (let i = 0; i < identity.length; i++) {
    let a = person[i].state;
    if (a == '存活') {
    $('.photo').eq(i).children('.realId').css('background', '#fbb435');
    } else if (a == '被杀手杀死' || a == '被投票处决') {
    $('.photo').eq(i).children('.realId').css('background', '#fff');
    }
    }

    /* 选择的对应框变色 */
    $(this).children('.realId').css('background', 'green');

    /* 被选人的编号 */
    idnum = $(this).attr('id') - 1;

    })


    编辑于2018-10-26
  • [郑州|结业弟子]JS-刘超
    0

    点击让一个盒子模型变色,其他的关闭这个效果你可以这么去做,。

    随着我们的点击会获取,当前点击的dom节点,然后给这个dom节点添加背景颜色就行了就可以了。其他的因为没有被选中,所以就没有。不知道这样说。你能理解吗?



    $(document).ready(function () {
       box();
       $(".kill").hide();//默认隐藏图片
       $(".game-box").click(function () {
     
           //运行点击事件时,清除,message的类名,如果没有这个类名的话.
           $(".role").removeClass("message-box");
           //点击获取dom,k所以盒子的kill添加,图片隐藏,因为图片本身时隐藏的.不写的话,它无法点击
           //其他盒子的时候显示
           $(".kill").css('display', 'none');

           //children查找子元素role之后,追加类名.改变颜色.
           // $(this).addClass('message-box');
           $(this).children(".role").addClass("message-box");
           //当前图片显示
           // $(this).siblings('img').show();
           $(this).children('img').show();
       });
            $(".role").removeClass("message-box");

    我们给role.节点删除lclass的方式,children遍历role.给它追加这个"message-box来改变颜色。this指向当前role,所以这样就实现了变色效果。

    编辑于2019-04-13
  • [北京|结业弟子]JS-肖明明
    0

    想想这是不是和单选按钮很像,一组单选按钮只能选择一个,我们只需要把默认的单选按钮隐藏,生成的label的for属性值和input的id值一样,就能够实现了

    //生成所有角色页面
    for (var i = 0; i < allNum; i++) {
    var txt = `<label for="div1">
           <div class="number">
               <div class="card">
                   <p class="alive">水民</p>
                   <p class="serial">1号</p>
               </div>
               <input type="radio" name="role" id="div1">
               <div class="knife">
                   <img src="./img/knife.png" alt="">
               </div>
           </div>
       </label>`;
    $('.main2').append(txt);
    //显示是水民还是杀手
    $('.alive').eq(i).text(function () {
    return role[i];
    });
    //显示编号
    $('.serial').eq(i).text(function () {
    return i + 1;
    });
    //添加value;
    $('input').eq(i).attr("value", function () {
    return i + 1;
    });
    //添加id
    $('input').eq(i).attr("id", function () {
    return "input" + (i + 1);
    });
    //添加for属性值和id相同
    $('label').eq(i).attr("for", function () {
    return "input" + (i + 1);
    });
    }

    css样式

    /* 默认隐藏小刀 */
    .knife {
    display: none;
    }
    /*隐藏单选按钮默认样式*/
    input[type="radio"] {

    position: absolute;

    clip: rect(0, 0, 0, 0);

    }
    /* 选中时显示小刀 */
    input[type="radio"]:checked + .knife{
    display: block;
    }

    我的任务页面链接,可以参考

    https://travelerone.github.io/learnJs/js3/js2.html

    编辑于2019-06-29