-
ID:uFFxrb さんの質問

jQueryの初心者向けテキスト(ドーナツ本 ascii.asciimw.jp/books/books/detail/978-4-04-891391-1.shtml)の勉強中なのですが、フォームに関するイベント処理(2-4サンプル8)で躓いてます。
フォームの送信ボタンを押して、名前欄[name]が空白だったら、.afterに<span>でfont-weight:boldの装飾された注意文が出る設定があります。何度もボタンを押した場合に、同じ注意文が後ろに連ならないように、2度目以降の空欄submitは、<span>がfont-weight:boldの場合は挿入されない、という設定のはずなのですが。

公式が配布しているサンプルファイルでそれを行っても、文字の連結が起こってしまいます。テキストの記述と、配布サンプルの記述に違いはないようなのですが、どこを直せば注意文の連結が起こらないのかが分かりません。

記述は↓こういうものなのですが
<script>
$(function(){
$("form").submit(function(){
if($("input[name=’name’]").val()==""){
if($("span").css("font-weight") != "bold"){
$("input[name=’name’]").css("border","1px solid red").after("<span>お名前を入力してください</span>");
$("span").css({
"color":"red",
"font-weight":"bold"
});
}
return false;
}
});
});
</script>

どこを修正すればよいのか分かる方、教えて頂けませんか。

みんなの回答 1 件

ID:uNfiFd さんの回答

ドーナツ本って読んだことないけど、こんな酷いソースなの?
何でclass使わないんだろう

まぁ、それはさておき、上記ソースを使って検証してみたら、
ChromeとSafariでは問題なく、Firefoxでは同じ現象が起こった。
Firefoxだと $("span").css("font-weight") で「700」が返ってくるから、
比較に失敗してどんどん文字が増えていっちゃうんだと思う。
つまり、ソース自体は間違ってないけど、ドーナツ本のやり方がよろしくないでFA。

とりあえず、このままドーナツ本で勉強していきたいなら、ChromeかSafariを使って試すのが良いかと

ID:uFFxrb

ありがとうございます!!!
動作確認firefoxとIEでしかしてませんでした(汗)

最終更新日:2014-05-12 (1,787 views)

関連するトピックス

ページ上部に戻る