質問編集履歴

1 インデントを入れました。

flyingHigh

flyingHigh score 27

2019/02/10 08:40  投稿

項目すべてを入力するとボタンが押せるようにしたい
###### ラジオボタンの選択項目とテキスト入力項目が2つあります。
各項目が入力されると各送信ボタンが押せるようになりますが、
3つある送信ボタンのうち2個を無くし、1つにして、
ラジオボタン、テキスト入力2つをすべて入力すると
送信ボタンが押せる、というふうにしたいのですが
どのようにすればよろしいでしょうか。
下記ソースには記載していませんが、
一度、lengthのある部分に||を入れて各項目の入力エリアを追記したのですが
うまくいかず困っています。
ご教授いただけませんでしょうか。
```html
<p>
<input type="radio" class="demo1" name="demo1" id="demo1-1" autocomplete="off">
<label for="demo1-1">デモ1</label><br>
<input type="radio" class="demo1" name="demo1" id="demo1-2" autocomplete="off">
<label for="demo1-2">デモ2</label><br>
<input type="radio" class="demo1" name="demo1" id="demo1-3" autocomplete="off">
<label for="demo1-3">デモ3</label>
<input type="radio" class="demo1" name="demo1" id="demo1-1" autocomplete="off">
 <label for="demo1-1">デモ1</label><br>
 <input type="radio" class="demo1" name="demo1" id="demo1-2" autocomplete="off">
 <label for="demo1-2">デモ2</label><br>
 <input type="radio" class="demo1" name="demo1" id="demo1-3" autocomplete="off">
 <label for="demo1-3">デモ3</label>
</p>
<p id="link1">ーー</p>
<p>
<input type="text" id="input1" autocomplete="off">
<input type="submit" id="submit1" value="送信">
 <input type="text" id="input1" autocomplete="off">
 <input type="submit" id="submit1" value="送信">
</p>
<p>
<textarea name="text2" id="text2" autocomplete="off"></textarea>
<input type="submit" id="submit2" value="送信">
 <textarea name="text2" id="text2" autocomplete="off"></textarea>
 <input type="submit" id="submit2" value="送信">
</p>
```
```js
$(function(){
$(".demo1").click(function(){
if(this.checked){
$("#link1").html("<a href='#'>送信</a>");
} else {
$("#link1").html("Next");
};
});
 $(".demo1").click(function(){
   if(this.checked){
     $("#link1").html("<a href='#'>送信</a>");
   } else {
     $("#link1").html("Next");
   };
 });
});
$(function(){
if ($("#input1").val().length == 0) {
$("#submit1").prop("disabled", true);
}
$("#input1").on("keydown keyup keypress change", function() {
if ($(this).val().length < 2) {
$("#submit1").prop("disabled", true);
} else {
$("#submit1").prop("disabled", false);
}
});
 if ($("#input1").val().length == 0) {
   $("#submit1").prop("disabled", true);
 }
 $("#input1").on("keydown keyup keypress change", function() {
   if ($(this).val().length < 2) {
     $("#submit1").prop("disabled", true);
   } else {
     $("#submit1").prop("disabled", false);
   }
 });
});
$(function(){
if ($("#text2").val().length == 0) {
$("#submit2").prop("disabled", true);
}
$("#text2").on("keydown keyup keypress change", function() {
if ($(this).val().length < 5) {
$("#submit2").prop("disabled", true);
} else {
$("#submit2").prop("disabled", false);
}
});
 if ($("#text2").val().length == 0) {
   $("#submit2").prop("disabled", true);
 }
 $("#text2").on("keydown keyup keypress change", function() {
   if ($(this).val().length < 5) {
     $("#submit2").prop("disabled", true);
   } else {
     $("#submit2").prop("disabled", false);
   }
 });
});
```
  • JavaScript

    23803 questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • HTML

    13788 questions

    HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

  • jQuery

    9351 questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る