一些表單中的輸入框輸入之后會進行判斷，會在input框之后以√×來表示判斷的結(jié)果，下面我使用偽元素來簡單的實現(xiàn)這個功能。代碼如下：
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>使用偽元素簡單實現(xiàn)input框后的√×</title> <script src="http://apps.bdimg.com/libs/jquery/1.11.3/jquery.js"></script> <style type="text/CSS"> body { font-family: "微軟雅黑"; font-size: 20px; color: #000; } label { height: 24px;line-height: 24px; } input { height: 24px;line-height: 24px; } .true:after { display: inline-block; content: '√'; width: 20px; height: 20px; vertical-align: middle; line-height: 24px; color: green; } .false:after { display: inline-block; content: '×'; width: 20px; height: 20px; vertical-align: middle; line-height: 24px; color: green; } </style></head><body><label id="inputBox"><input type="text" name="user" id="input"></label><script>$("#input").blur(function(){ if($(this).val() == "對"){ $("#inputBox").removeClass("false").addClass("true"); }else if($(this).val() == "錯"){ $("#inputBox").removeClass("true").addClass("false"); }});</script></body></html>使用js或者jQuery好像獲取不到偽元素，我試了幾種方法都顯示undefined，至于原因我看網(wǎng)上說的是偽元素不是Dom節(jié)點，所以是獲取不到的。（我用的jQuery版本是1.11.3，其他版本沒有試）。 最后是采用加減class類名來實現(xiàn)的，將兩個狀態(tài)下的偽元素綁定在兩個類名之后，在不同的判斷結(jié)果時候只需要添加或刪除相應(yīng)的class類名即可。
新聞熱點
疑難解答
