3

JavaScriptでデータを確認してから送信するフォームを作りたいです。フィールドが空の場合、境界線を赤に設定したい。

HTML コード:

<label>Question: </label><input type = "text" maxlength = "100" name = "question"> <br />

JavaScript コード 1:

fields[i].style.borderColor = "red";

JavaScript コード 2:

fields[i].style.border = "1px solid red";

JSコード1を使用すると、境界線の色が変わりますが、以前よりも幅が大きくなります(境界線の幅については何も言いませんが)。JS コード 2 を使用すると、テキスト入力が 2px で縮小され、変化が顕著になります。

枠の色だけ変えるにはどうしたらいいですか？

4

5 に答える 5

4

実際には、これはクラスを追加および削除することで優先されます。

$("input").change(function()
  {
     var value = $(this).val();
     if(value=="")
     {
          $(this).addClass("red-border");
          $(this).focus();
     }else
     {
          $(this).removeClass("red-border");
     }
  });

そしてあなたのCSS：

.red-border{
    border: 1px solid red;
}
于 2013-11-08T20:16:21.383 に答える
1

ボーダーの代わりにアウトラインを使用します。

fields[i].style.outline = "1px solid red";

于 2013-11-08T21:02:13.103 に答える
0

これを試してみてください。Jクエリ

 $("input").change(function ()
  {
     var value = this.value;
     if(value=="")
     {
          $(this).css("border", "1px solid red");
     }else
     {
        $(this).css("border",'');
     }
  }).trigger("change");

HTML

  <input type="text" class="col">
于 2013-11-08T20:08:52.370 に答える