- ベストアンサー
jQueryを使ってhtmlのidとclassを見てif文を書きたいと
jQueryを使ってhtmlのidとclassを見てif文を書きたいと思ってます。 if id="EditButton" class="active button"がある場合～ ってしたいのでどのようにすればいいのでしょうか。 if(jQuery('#EditButton').is('active button')){ とかにしてみましたがマッチしてくれませんでした。 宜しくお願い致します。
- sti_test
- お礼率57% (15/26)
- JavaScript
- 回答数3
- ありがとう数4
- みんなの回答 （3）
- 専門家の回答
関連するQ&A
- if文について
おはようございます。 if文について聞きたい事があります。 現在jqueryでJSONを使用して「もっと読む」みたいな感じで、 ボタンをクリックすると指定した数だけ画像が表示されるという物を作っているのですが、 その際にif文で、全ての点数を超えたらボタンを非表示にし、点数を超えていなかったら表示するという物を作っているのですが、 現在、 （addedは今までの点数を加えて来たもので、 fillterが全ての点数で、 $buttonがボタンとなります。） if(added > fillter.length){ $button.hide(); }else{ $button.show(); } とやると、点数を超えても表示されたままですが、 if(added < fillter.length){ $button.show(); }else{ $button.hide(); } とやると、点数を超えたら非表示になります。 どういう事が起こっているのでしょうか。 全文がやや長いため、省略しております。 大変申し訳ありませんが、教えていただきたいです。
- ベストアンサー
- JavaScript
- jQueryのclass属性削除ができません
OS：Windows7 ブラウザ：IE１０ いつもこちらでお世話になっています。 以下のようなjQueryで、removeClassでclass属性を削除しようとしていますが、削除できません。 －－スクリプト－－ $(function () { $(".datepicker").datepicker({ changeMonth: true, changeYear: true, showMonthAfterYear: false, dateFormat: 'yy-mm-dd', showOn: "button", buttonImage: "calendar.gif", buttonImageOnly: true, buttonText: "カレンダ表示", yearRange: "2003:2025", speed: "fast" }); $("#ID").click(function(){ (".datepicker").removeClass("datepicker"); }); －－HTML(簡略)－－ <input type='text' class='datepicker' size='12' maxlength='10' style='ime-mode:disabled'> <input type='button' id='ID'> jQuery UIのdatepickerが関係していると思うのですが、どこか記述に問題があるのでしょうか。 どなたかご教示お願いいたします。
- 締切済み
- JavaScript
- if文の書き方
プログラム初心者です if文の処理速度が速いのは一般的に考えてどちらでしょうか? 別々にif文で処理する方法 try { if(!isset($_REQUEST['id'])&& !is_string($_REQUEST['id'])){ throw new Exception('error'); } if(!isset($_COOKIE['date'])&& !is_string($_COOKIE['date'])){ throw new Exception('error'); } } catch (Exception $e) { $msg = $e->getMessage(); } 一緒に処理する方法 try { if(!isset($_REQUEST['id']) && !is_string($_REQUEST['id']) && !isset($_COOKIE['date']) && !is_string($_COOKIE['date'])){ throw new Exception('error'); } } catch (Exception $e) { $msg = $e->getMessage(); } よろしくお願いします
- ベストアンサー
- PHP
- jqueryの置き換えについて
jsで作った電卓をjqueryに置き換えしなくてはいけなくなったのですが、 jqueryは習ってる最中で何がなんやら書き換えがうまくできません。 jqueryの導入の仕方や基本的な書き方はわかるのですが、書き換えると何かしら必ず定義されていないなどエラーが出てしまいます。ｊｓで書いたものはちゃんと動いていたのにjqueryに書き換えると微動だにしません。 書き換え後のコードを頂けたら幸いです。 html <body class="body1"> <div class="calculator"> <div id="display" value="0">0</div> <div class="commands"> <div class="command is-2col" onclick="calc_func(this)" value="clear">clear</div> <div class="command empty"></div> <div class="command is-operator" onclick="calc_func(this)" value="/">÷</div> <div class="command" onclick="calc_func(this)" value="7">7</div> <div class="command" onclick="calc_func(this)" value="8">8</div> <div class="command" onclick="calc_func(this)" value="9">9</div> <div class="command is-operator" onclick="calc_func(this)" value="*">×</div> <div class="command" onclick="calc_func(this)" value="4">4</div> <div class="command" onclick="calc_func(this)" value="5">5</div> <div class="command" onclick="calc_func(this)" value="6">6</div> <div class="command is-operator" onclick="calc_func(this)" value="-">-</div> <div class="command" onclick="calc_func(this)" value="1">1</div> <div class="command" onclick="calc_func(this)" value="2">2</div> <div class="command" onclick="calc_func(this)" value="3">3</div> <div class="command is-operator" onclick="calc_func(this)" value="+">+</div> <div class="command is-2col" onclick="calc_func(this)" value="00">00</div> <div class="command" onclick="calc_func(this)" value="0">0</div> <div class="command is-equal" onclick="calc_func(this)" value="=">=</div> </div> </div> <body> js function calc_func(button) { // console.log(button); var display = document.getElementById("display");//id名 displayの要素を取得 変数displayに代入 var button_value = button.innerHTML; //button_valueの変数に、buttonの中身を取得 console.log(button_value) if (button_value === "clear") { //押したのがclearなら、displayの中身がinnerHTMLで０に変わる display.innerHTML = "0"; }else if (button_value === "=") { //押したのが＝なら、displayの中身をnew funcで計算して値を返す var replace_value = display.innerHTML.replaceAll("×", "*").replaceAll("÷", "/"); //replaceAllは("対象の文字列","置き換えする文字列")で文字を置き換えできる display.innerHTML = (new Function ("return " + replace_value))(); //押されたキーの内容を判別せず、単純にそのまま文字列として記憶して、計算時に、そのまま文字列の計算結果を返すようにreturnの文字列を付け加える }else if (display.innerHTML === "0" || display.innerHTML === "00") { if (!isNaN(button_value) || button_value === "-") { display.innerHTML = button_value; } }else { if (isNaN(button_value)) { var migihashi = display.innerHTML.slice(-1); if (!isNaN(migihashi)) { display.innerHTML += button_value; } }else { display.innerHTML += button_value; //それ以外の動き +=はdisplay.innerHTML＝display.innerHTML＋button_valueの略し } } } css .calculator { width: 205px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); margin: auto; } #display { width: 205px; background: #5b5b5b; text-align: right; border: 1px solid #000; box-sizing: border-box; color: #fff; font-size: 25px; padding: 5px 10px; } .display.flashing { animation-name: flash; animation-duration: 0.1s; } @keyframes flash { 0% { color: #5b5b5b; } 90% { color: #5b5b5b; } 100% { color: #fff; } } .commands { width: 204px; background: #000; display: flex; flex-wrap: wrap; padding-left: 1px; } .command { width: 50px; height: 45px; background: #ddd; margin: 0 1px 1px 0; text-align: center; padding-top: 10px; box-sizing: border-box; font-size: 18px; } .command.is-operator, .command.is-equal { background: orange; color: #fff; } .command.is-2col { width: 101px; } .command:active { background: #bbb; } .command.is-operator:active, .command.is-equal:active { background: #d37e00; } .command.empty:active { background: #ddd; } #debug { display: none; }
- ベストアンサー
- その他（プログラミング・開発）
- idとclassで表示が変わる
お世話になります。 HPで以下のようなページを製作中です。 ---------------------------------- Name1 photo 説明文説明文説明文 説明文説明文説明文 Next ---------------------------------- Name2 photo 説明文説明文説明文 説明文説明文説明文 Next ---------------------------------- 画像のように作れないのでわかりにくいかと思いますが、図のように 左にサムネイル画像があり、右側に写真の名前、その下に説明文、 一番下に「次へ」というボタンがきます。 1PにこのBOXが縦に5個ずつ並ぶようにしたいのですが、HTMLとCSSはこのような感じで作っています。 ----------------------------------------------------- <div id="box"> <a href=""><img src="name1.jpg" alt="写真1" width="132" height="90" class="leftimg" /></a> <h2>Name1</h2> <p>説明文説明文説明文説明文説明文説明文説明文説明文説明文<br /> <a href=""><img src="next.gif" alt="次へ" width="110" height="20" class="rightimg" /></a></p> </div> ----------------------------------------------------- #box { clear: both; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #999999; padding: 5px; width: 620px; height: 95px; } #box h2 { color: #4A111C; font-size: 12px; margin: 0px; padding: 0px; background-color: #FFFFFF; } #box p { font-size: 12px; margin: 0px; padding: 0px; } --------------------------------------------- 今はこの5つをidとしていますが、1ページに同じidをつけるのはまずいかと思い、div classに変更しようとするのですが、idで指定したときと同じような表示になりません。 classの場合は#の代わりに以下のようにドットに変更すれば同じ表示になるのかと思っていましたが違うのでしょうか？ .box { ちなみに、本によっては1ページに同じidを何度か繰り返して使っているものもありますが、idのままでもかまわないのでしょうか？ このソースでおかしい場合はご指摘いただけると助かります。 よろしくお願い致します。
- ベストアンサー
- HTML
- jquery classの消し方
jquery初心者です。 テーブルのthやtdの中に空白や未入力があった場合、classの「tb_menu_border」を削除したいのですが、どのように記述したらよいかわかりません。 どなたか詳しい方は、いらっしゃいますでしょうか？ <script type="text/javascript"> <!-- if($(".tb_menu_border").text().replace(/\s+/g,'').length > 0){ $("table").removeClass("tb_menu_border"); }; --> </script> <table class="tb_menu"> <tr> <th class="tb_menu_border">メニュー名</th> <td class="tb_menu_border">300円</td> <td class="td_menu_sp"> </td> <th class="tb_menu_border">メニュー名</th> <td class="tb_menu_border">300円</td> <td class="td_menu_sp"> </td> <th class="tb_menu_border">メニュー名</th> <td class="tb_menu_border">300円</td> <td class="td_menu_sp"> </td> </tr> <tr> <th class="tb_menu_border"> </th> <td class="tb_menu_border"> </td> <td class="td_menu_sp"> </td> <th class="tb_menu_border"></th> <td class="tb_menu_border"></td> <td class="td_menu_sp"> </td> <th class="tb_menu_border"> </th> <td class="tb_menu_border"> </td> <td class="td_menu_sp"> </td> </tr> </table>
- ベストアンサー
- JavaScript
- classとidの名前の付け方
classとidの名前の付け方についてお伺いします。 1. classとidの名前の付け方によってSEOに関係するのでしょうか？ 2. むやみにclassやidを付けずにセレクターなどを使うほうがよいのでしょうか？ 3. 例えばid="category1"とつけるのとid="cat1"というように省略するとgoogleは「cat1ってなんだよ？」と判断したりしてランクを下げたりしますか？ 4. 同じid名を1つのhtml内に複数使っていたり、class名が1つしか使われていないWebサイトをよく見掛けます。これでもブラウザは解釈するようですが、html内で1つしか使わないのにclassで指定するのは良くないのでしょうか？ 5. そもそもidとclassをgoogleはどのように判別しているのでしょうか？idは見出し、classはその下のカテゴリとか・・・そういう感じですか？ なかなかネットを検索してもわからなかったのでこちらで質問させて頂きました。 お手数ですがよろしくお願い致します。
- ベストアンサー
- CSS
- ｊQueryでのclassの操作
現在Wordpressに、文字のサイズを「小・中・大」と変えるjQueryを設置しています。 http://az-store.nrym.org/download/extend/jquery-fontsize-switcher/ Wordressではもともとbodyのclassに指定があるのですが、このjQueryを設置すると removeAttr("class")で削除されてしまいます。 そこで、もともとのClassを活かしたまま文字サイズ変更用のクラスだけを 削除&追加ができればいいのですが、 どうすればよいでしょうか？ ただ、単純に「removeAttr("class")」の記述を削除してしまうと、 文字サイズ変更スイッチを押す度に、クラスが追加され続けるのでそれは避けたいです。 $(function(){ var currentstyle = readCookie('fontStyle'); if (currentstyle){ switchFont(currentstyle); }; $("li.sizeL").click(function(){ switchFont("fontL"); return false; }); $("li.sizeM").click(function(){ switchFont("fontM"); return false; }); $("li.sizeS").click(function(){ switchFont("fontS"); return false; }); }); function switchFont(className){ $("body").removeAttr("class").addClass(className); createCookie('fontStyle', className, 365); }; // cookie script http://www.quirksmode.org/js/cookies.html function createCookie(name,value,days){ if (days){ var date = new Date(); date.setTime(date.getTime()+(days*24*60*60*1000)); var expires = "; expires="+date.toGMTString(); } else var expires = ""; document.cookie = name+"="+value+expires+"; path=/"; } function readCookie(name){ var nameEQ = name + "="; var ca = document.cookie.split(';'); for(var i=0;i < ca.length;i++) { var c = ca[i]; while (c.charAt(0)==' ') c = c.substring(1,c.length); if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); } return null; }
- ベストアンサー
- AJAX
- 【jQuery】for文ではイベント登録できない？
複数のボタンがあり、それぞれがクリックされると、 対応したdiv要素がanimateを行う、というギミックを作成しております。 配列に複数のボタンのid名と、各div要素のid名を格納しておき、 for文でclickイベントを登録しようとしましたが、うまく動作しませんでした。 【例1】 jQuery(function($){ var buttonArray = ["#button0", "#button1", "#button2"]; var divArray = ["#box0", "#box1", "#box2"]; for(i=0; i<buttonArray.length; i++){ $(buttonArray[i]).click(function(){ $(divArray[i]).animate({width: "0px"}, "slow", "swing"); }); } }); --------------------------------------------------- 以下のように書くと、正常に動作しました。 【例2】 jQuery(function($){ var buttonArray = ["#button0", "#button1", "#button2"]; var divArray = ["#box0", "#box1", "#box2"]; $(buttonArray[0]).click(function(){ $(divArray[0]).animate({width: "0px"}, "slow", "swing"); }); $(buttonArray[1]).click(function(){ $(divArray[1]).animate({width: "0px"}, "slow", "swing"); }); $(buttonArray[2]).click(function(){ $(divArray[2]).animate({width: "0px"}, "slow", "swing"); }); }); --------------------------------------------------- そこで質問なのですが、 ・for文ではイベントの登録は行えないのか？ ・今回のようなケースの場合、どのように書くのが適切か？ 上記2点に関して、ご回答、ご意見を頂けますと幸いです。 どうぞよろしくお願い申し上げます。
- ベストアンサー
- JavaScript
- if文でelseを使わずに否定
質問させてください。 現在JSを勉強させていただいています。 if( $( 'input:checkbox[value="448"]' ).is( ':checked' ) ) { jQuery('.abc').css({display:'none'}); } 上記の文はチェックボックスにチェックが入っていたら CSSを置き換えるというものなのですが これをelseを使用せずにチェックが入っていなかったら CSSを置き換える という文にすることは可能でしょうか？ もしよろければご回答のほどよろしくお願いいたします。
- 締切済み
- JavaScript
お礼
think49様のを元に下記にしてみましたところ問題なく動作しました。 if(0 < jQuery('#EditButton.active').length){ 皆様ありがとうございました。