Question

我对JQuery很新，事实上这是我写过的第一个脚本。以下简单地查找所有具有“TestDIV”类的DIV，然后对其中的输入执行一些操作。

除了borderColor之外，一切都有效，它仍然是我最初设置它的颜色。有没有人对这是为什么有任何想法？我也非常欢迎提供有关如何改进代码的提示。

function hideAndShowJQ(show) {
        var hideColor = "#DFDFDF";
        //Find DIVs and modify styling
        var div = $('div.TestDIV'); //Find relevant divs
        div.css('color', (show) ? "" : hideColor) //Change text colour
            .find(':input').attr("disabled", !show) //Disable any inputs
            .attr("borderColor", "red") //Change border colour of inputs
            .attr("value", ""); //Clear any existing input text
}

Answer 1

问题是borderColor不是元素的属性，它是CSS属性。

要更改css属性/值，请使用css()。此外，当使用引号时"border-color"而不是borderColor（尽管@Felix Kling注意到，在下面的评论中，关于camelCase在引号中并不重要）：

div.css('color', (show) ? "" : hideColor) //Change text colour
            .find(':input').attr("disabled", !show) //Disable any inputs
            .css("border-color", "red") //Change border colour of inputs
            .attr("value", ""); //Clear any existing input text

鉴于您正在使用jQuery，并且要清除input元素，使用val()可能更容易，而不是attr()：

.val(''); // sets the value of the input to an empty string.

Answer 2

这也可能有用：

    $('#div-name :input').attr("disabled", !show);

因为我对文本框的边框样式使用了相同的表单

    $('#div-name :input').attr("style", "");

Answer 3

应该是：$(this).css("borderColor","red")。

Answer 4

您正在应用borderColor变量错误。

$(this).css("borderColor","red");

Answer 5

你可以在chrome和safari中使用速记符号，但是Mozilla不支持它。

$(this).css("borderColor");

因此，您必须使用更具体的符号来表示浏览器兼容性。你可以改用这个：

$(this).css("border-top-color");
$(this).css("border-right-color");

等...

在JQuery中更改borderColor的问题

5 个答案: