テキスト、画像、動画のいずれか一つ以上が選択されている場合に投稿ボタンを押せるようにしたいのですが動画が選択されているかどうかの判定方法がよくわかりません。
テキスト・画像いずれか一つ以上が選択されているかどうか
JavaScript
1 $(document).ready(function() { 2 $('#submit').prop('disabled', true); 3 $('.photo-up').on('click', function() { 4 if ($(this).val().length > 0) { 5 $('#submit').prop('disabled', false); 6 } else { 7 $('#submit').prop('disabled', true); 8 } 9 }); 10 $('#text').on('keydown keyup keypress change', function() { 11 if ($(this).val().length > 0) { 12 $('#submit').prop('disabled', false); 13 } else { 14 $('#submit').prop('disabled', true); 15 } 16 }); 17 });
画像・テキストは上記のコードで成功したのですが下記のコードのように動画が選択されているか否かの処理がうまくいきません。
テキスト・画像・動画のいずれか一つ以上が選択されているかどうか
JavaScript
1 $(document).ready(function() { 2 $('#submit').prop('disabled', true); 3 $('.photo-up').on('click', function() { 4 if ($(this).val().length > 0) { 5 $('#submit').prop('disabled', false); 6 } else { 7 $('#submit').prop('disabled', true); 8 } 9 }); 10 $('.video-up').on('click', function() { 11 if ($(this).val().length > 0) { 12 $('#submit').prop('disabled', false); 13 } else { 14 $('#submit').prop('disabled', true); 15 } 16}); 17 $('#text').on('keydown keyup keypress change', function() { 18 if ($(this).val().length > 0) { 19 $('#submit').prop('disabled', false); 20 } else { 21 $('#submit').prop('disabled', true); 22 } 23 }); 24 }); 25
HTML
HTML
1<form enctype="multipart/form-data" action="/posts" accept-charset="UTF-8" data-remote="true" method="post"><input name="utf8" type="hidden" value="✓"><input type="hidden" name="authenticity_token" value="ernAj77WKTiNZEei/svubbs6kFdUbQmTz9BXZokkwIO5TBttzzrwwvx7e3xwB08vj405N7XqJqcOlj+tZDeiPA=="> 2 <textarea placeholder="投稿内容" class="post-form-new" rows="3" onkeyup="ShowLength(value);" id="text" name="post[text]" style="overflow: hidden;"></textarea> 3 4 <div class="new-buttons"> 5 <div id="preview"></div> 6 <label> 7 <div class="tooltip1"> 8 <span class="filelabel"> 9 <input id="filesend" onchange="imgPreView(event)" accept="image/*" class="photo-up" type="file" name="post[image]"> 10 <img width="32" height="26" class="post-photo" src="/assets/photo-fca06e0acf6ae91e871e7cc024a426beed0f3a3fb15e835f9cd1ea39f6df3650.svg"> 11 <div class="photo-pop">画像を追加</div> 12 </span> 13 </div> 14 </label> 15 <label> 16 <div class="tooltip1"> 17 <span class="filelabel"> 18 <input id="video" onchange="imgPreView(event)" accept="video/*" class="video-up" type="file" name="post[video]"> 19 <img width="32" height="26" class="post-photo" src="/assets/video-eebb3db2834953c60d60b63a96ec4d67cb8c9f8c681a033d1b7b8885879fbe25.svg"> 20 <div class="video-pop">動画を追加</div> 21 </span> 22 </div> 23 </label> 24 25 <input type="submit" name="commit" value="投稿" class="new-post-btn" id="submit" data-disable-with="投稿" disabled=""> 26 <p id="inputlength" class="new-textlength">0/250</p> 27 </div> 28</form>
画像が選択されているか判定するコードと動画が選択されているか判定するコードはclass名を変更するだけではいけないのでしょうか。
JavaScriptに詳しい方教えていただけると幸いです。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。