小编blo*_*k14的帖子

选择偶数和奇数级孩子的正确选择器是什么？

我想简化我当前的CSS,同时允许无限级别,而无需在CSS中手动编写它们.

.box {
    max-width:100%;margin:25px 0px;padding: 15px;
    border:#d1ddbd solid  2px;
    background-color:#f3fae8;
}

.box > .box {
    border:#d1ddbd solid  1px;
    background-color:#fff;
}

.box > .box > .box {
    border:#d1ddbd solid  1px;
    background-color:#f3fae8;
}

.box > .box > .box > .box {
    border:#d1ddbd solid  1px;
    background-color:#fff;
}

我正在处理Chrome希望使用用户地址自动填写的联系表单中的文本区域.因此,用户在评论字段中提交了许多联系请求及其地址.除了可以利用的明显潜在的安全问题之外,我担心的是从用户的角度来看,我们提供的联系表单没有区域来键入消息.从支持的角度来看,我们不得不要求用户向我们发送另一条带有实际问题的消息.

HTML:

 <textarea id="element_10" class="validate[required] floatlabel js-auto-size multiple-lines" name="element_10" placeholder="Message*" rows="10" cols="60" required autocomplete="off"></textarea>

我编写了一个内联脚本,以便在浏览器无法加载SVG并将其替换为PNG图像时自动处理.这部分工作得很好,但我也想改变图像onhover,这个答案对我很有用,除了我不需要它"运行和查找"如果浏览器可以处理SVG并且不使用PNG.所以,当我将一类noSVG(此处称为"myclass")添加到IMG标签时,我想我会触发它.

现在这里是问题的开始,我可以使用CSS来修改添加的类的样式.但我不能使用jQuery来修改它.更奇怪的是,当我为你们添加它给JSFiddle时,它确实有效.在你们认为我使用的是jQuery的糟糕版本之前,我测试了多个版本(包括由JSFiddle使用的1.10.1).

HTML:

<img src="1.svg" onerror="this.onerror=null; this.src='1.png'; this.className+=' myclass';" class="image" id="1" />

jQuery的:

$(function() {
    $(".myclass")
    .mouseover(function() { 
        var src = $(this).attr("src").match(/[^\.]+/) + "hover.png";
        $(this).attr("src", src);
        //console.log("moused over");
    })
    .mouseout(function() {
        var src = $(this).attr("src").replace("hover.png", ".png");
        $(this).attr("src", src);
        //console.log("moused out");
    });
});

的jsfiddle

我的图像在点击时会发生变化,并在点击后保持2秒钟.

这IMG src是通过jQuery更改并在setTimeout返回源之后.问题是,如果用户在这2秒内第二次点击,则源会更改为无效位置.

我试图通过检查src图像的当前是否包含值来防止这种情况发生_hover.png:

if ('ThisIMG img[src*="_hover.png"]') {
    console.log("yes it does");
}

我在这个if语句中尝试了多个方法,但我似乎无法得到正确的参数.

以下是我尝试过的一些不同的事情:

$('.myImage').on({'click': function(){
        var ThisIMG = $(this);

        //if (ThisIMG.src == '_hover') {
        if ('ThisIMG img[src*="_hover.png"]') {
            console.log("yes it does");
        }
        //if (ThisIMG.attr("src").contains "_hover.png") {
        //  console.log('yes it does');
        //};

        // Method to change image source on click:
        var src = $(ThisIMG).attr("src").replace('.png', '_hover.png');
        $(ThisIMG).attr("src", src);
        console.log(src);

        setTimeout(function () {
            console.log("in timeout");
            var src = $(ThisIMG).attr("src").replace("_hover.png", ".png");
            $(ThisIMG).attr("src", src);

        },1000);
    } …