Question

我想将CSS类应用于我网站中的每个文本框：

        <div class="editor-label">
            <label for="FoodType">FoodType</label>
        </div>
        <div class="editor-field">
            <input id="HelpText" name="FoodType" type="text" value="" />
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>

我想，嘿！简单。我将添加一个jquery函数，以便在母版页中找到它们。

<script type="text/javascript">
    $(document).ready(function(){
        $('input').addClass('textbox');
    }
</script>

不幸的是，这也会选择提交按钮。我怎样才能选择具有文本类型属性的输入元素？

Alternativly这可能完全使用CSS吗？

如果这两种方法都不可行，我想我只需要手动将课程添加到我制作的每个文本框中？

Answer 1

AFAIK：

$('input[type=text]').addClass('textbox');

你可以在CSS文件中做类似的事情，但是这需要更高版本的CSS /取决于你想要使用旧版浏览器的广泛程度。

请参阅here中的属性选择器。请注意：

“浏览器支持：唯一不支持CSS3属性选择器的浏览器是IE6。IE7和IE8，Opera和基于Webkit和Gecko的浏览器都可以。所以在样式表中使用它们绝对是安全的。” / p>

Answer 2

<!DOCTYPE html>

<html>
<head>

<script type = "text/javascript" src = "http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>


<script type="text/javascript">
$(document).ready(function(){

$(".post_class").css({padding:"10px",background:"#333",color:"#fff"});

$("#post_button").css({padding:"10px",background:"#333", textAlign:"center",color:"#fff",cursor:"pointer"})

$("#post_button").click(function(){
var input = $("input[name='checkListItem']").val();

$(".post_class").append('<div class="item">' + input + '</div>');

});

});
</script>


</head>

<body>

<form name="checkListForm">

<input type="text" name="checkListItem"/>

</form>

<div id="post_button">Post</div>

<br/>

<div class="post_class"></div>

</body>

</html>

将Css类添加到所有<input type'text'=“”/>元素？ Javascript / Css？

2 个答案: