- ベストアンサー
jQueryで、指定した要素の子要素の値を取得
<form> <section><span class="area">大阪</span> ・jQueryで、上記の「大阪」を取得するにはどうすれば良いでしょうか？ ・既に「.find('section')」で、$(this)に<section>タグを取得しているのですが、その下のspanタグ内にある値、というやり方で取得するにはどう書けば良いでしょうか？ $(this).children.value とかやってもうまくいきませんでした
- re97
- お礼率80% (601/744)
- JavaScript
- 回答数1
- ありがとう数2
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
こんにちは。 sectionを取得したのと同様にやれば良いと思います。 $(this).find('span').text() これで「大阪」が取得できます。
関連するQ&A
- jQueryで同じ要素の先頭へ親要素を移動したい
下記のとき、<span>□</span>をクリックしたら、pタグの一番上へ要素を移動するにはどうすればよいでしょうか？ 変更前 <section> <div>★</div> <p><span>☆</span></p> <p><span>■</span></p> <p><span>□</span></p> 変更後 <section> <div>★</div> <p><span>□</span></p> <p><span>☆</span></p> <p><span>■</span></p> ■やりたいこと ・<section>はそれぞれ複数あるので、クリックした地点からの相対パスで、一番上要素を指定したいです ・「$(this).parent()」を、「$(this).parent()」のpタグ先頭の先頭へ追加すればよい？ どうやって？
- ベストアンサー
- JavaScript
- jQueryのcontainsフィルターについて
こんにちは。 jQueryについてご質問があります。 jQueryのcontainsフィルターで要素を取得できなくて困っております。 たとえば以下のようなHTMLがあるとします。 ======================== <g class="parent"> <text width="50" height="50" x="10" y="10"><tspan>abc</tspan></text> </g> ======================== このときtspan要素を取得したい場合、 $("g.parent text tspan:contains('abc')"); のようにしても取得できないのです。 例えば次のパターンの場合 ========================= <section class="parent"> <p><span>abc</span></p> </section> ========================= $("section.parent p span:contains('abc')"); というコードを実行すると正確にspan要素を取得できます。 前者の場合はなぜ取得できないのでしょうか？ ご教示よろしくお願いいたします。
- 締切済み
- JavaScript
- jqueryで要素の獲得方法
jqueryについてお聞きしたします。 下記のようなソースで <div class="sideBox"> <div class="sideBoxHead"> ・・・ </div> <div class="sideBoxInner basename"> <ul><li class="on"><span title="main title">aaa</span></li> <li><a href="html1" title="title1">bbb</a></li> <li><a href="html2" title="title2">bbb</a></li> ： ： <li class="last"><a href="htmlX" title="titleX">zzz</a></li> </ul></div> </div> "title2"をクリックした時の"html2"を獲得したいのですが $("div.sideBox > div > ul > li > a").click(function(){ var value = this.href; console.log("varlue = " + value); }); としても値が獲得できません。 直接"sideBoxInner basename"classからたどれば上手くいくような気がするのですが クラス名に半角スペースがある場合、どのようにすればいいのでしょうか？
- 締切済み
- JavaScript
- jqueryでhrefの値を取得して代入する方法
jquery 初級者です。 下の様なaタグをクリックした時に、（リンク先に移動し）hrefの値と紐付けされているdivを開きたいのですが、どうしてもうまくいきません。 <a class="btn" href="#contents">開く</a> <div id="contents" style="display:none;"> 開きたいコンテンツ。通常は見えない。 </div> ※実際はこうしたリンク要素がたくさんあるため、hrefの値を取得する形にしたいのです。 どなたか詳しい方宜しくお願い致します。
- 締切済み
- JavaScript
- jqueryでRSS内のdc:dateなどの要素の取得方法
jqueryを使用してRSSのdc:dateやdc:subjectなどの要素を取得するにはどうしたらよいでしょうか。 現在以下のようなコードにしていまして、なんとなく取得したRSSの最初に書いてあるxmlns:dc="http://purl.org/dc/elements/1.1/" となってる部分を利用すればいいのかなと思い立ち、children関数などを使ってみましたが取得できませんでした。 $.ajax({ url: settings.xmllocation, async: true, cache: false, dataType: "xml", success: function(xml) { $(xml).find('item').each(function() { var title = $(this).find('title').text(); var url = $(this).find('link').text(); var date = $(this).children('http://purl.org/dc/elements/1.1/').find('dc:date').text(); var element = $('<div><a href="' + url + '">' + title + '('+date+')</a></div>'); $(container).append(element); elements.push(element); }); });
- ベストアンサー
- JavaScript
- AtomでjQueryは使えますか？
ローカルフォルダ内にindex.html、contact.html、style.css、contact.css、script.js、5つのファイルを作成し、Atomでコーディング中です。 index.htmlとcontact.htmlの<head></head>内で<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>とし、</body>直前で<script src="./script.js"></script>、又、script.jsに$(function(){この中にコード});と記述。 (1)まずここで質問ですが、これでjQueryの使用環境は整ってますでしょうか？ 続きまして、先ほどの質問内容とは違ってしまいますが、アコーディオン作成のため、index.html内の <div class="qa"> <h1 class="question-text"> <span class="fa fa-question-circle"></span> 名前は何ですか？ </h1> <span id="up" class="fa fa-angle-up"></span> <p class="answer-text">ほげほげです。</p> </div>に対してscript.jsにて $('.question-text').click(function(){ var $answer=$(this).parent().find('.answer-text'); if($answer.hasClass('open')){ $answer.removeClass('open'); $answer.slideUp(); $(this).parent().find('#down').html('<span id="up" class="fa fa-angle-up"></span>'); }else{ $answer.addClass('open'); $amswer.slideDown(); $(this).parent().find('#up').html('<span id="down" class="fa fa-angle-down"></span>'); } }); と記述。→グーグルのブラウザで確認。→クリックしても動かない。 という状況です。 (2)ここでまた質問ですが、(1)の時点でjQuery使用環境が整っていれば、動かない理由は単に私のコードが間違っている事になる訳ですが、どうでしょうか・・・？ ご意見賜りたくお願い申し上げます。
- 締切済み
- JavaScript
- jqueryを使って無駄なspanタグを削除したい
お世話になります。 jqueryを使って無駄なspanタグを削除したいのですが、可能でしょうか？ 例えば以下のhtmlがあった場合、 ------------------------------------------ <span class="a">あいうえお</span> <span>かきくけこ</span> <span class="b">さしすせそ</span> <span>たちつてと</span> ------------------------------------------ jqueryを使うことで、 ------------------------------------------ <span class="a">あいうえお</span> かきくけこ <span class="b">さしすせそ</span> たちつてと ------------------------------------------ このように無駄なspanタグを削除したいのですが、可能でしょうか？ ご存知の方、ご回答いただければ幸いです。 よろしくお願い致します。
- ベストアンサー
- JavaScript
- htmlのformの表示について【Jquery】
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.min.js"></script> <script type="text/javascript"> function formChanged(ev){ var sel = $('.chk:checked').map(function () { return this.checked ? this.value : null; }).get().join(); $("#output").text(sel); } formChanged(null); $(document).on("change",'.chk:checked',formChanged); </script> <form method="post" action="mail.php"> <table> <tr> <th>カテゴリー</th> <td> ・ABC： <input type="checkbox" name="カテゴリー[]" value="[abc]" class="chk" /> ・DEF： <input type="checkbox" name="カテゴリー[]" value="[def]" class="chk" /> ・GHI： <input type="checkbox" name="カテゴリー[]" value="[ghi]" class="chk" /> </tr> <tr> <th>選択した製品シリーズ</th> <td><span id="output"></span></td> </tr> <tr> </table> </form> これは、チェックボックスにチェックをいれたチェックボックスの値がリアルタイムに表示される仕組みなのですが、逆にチェックを外した場合は、値が消えません。消えるようにするにはどうしたらいいでしょうか。アドバイスをいただけると幸いです。
- 締切済み
- JavaScript
- JQueryのセレクタ
jqueryでセレクタの取得をしたいのですがうまくいきません div要素の中のspan要素を取得したいのですがclassで取得すると重いのでid属性で場所を限定してからclass属性で絞り込みたいです こんな感じにしたらだめでした $("#hoge.foo").html('ほげ'); html <div id=hoge> <span class=foo></span> </div>
- ベストアンサー
- JavaScript
- 値の取得について
IPアドレス入力欄のように以下のソースのような流れを作成したのですが、エリアに３文字入力をして、入力したものの最後の文字が数字であったら、キーボードのTabを使っても、onKeyUpで呼んだ関数でも、その入力した３文字が数字だと認識してすぐ横のエリアに移りたいのですが、その入力をした際の３文字目の値を取得することは可能なのでしょうか？Whichを使ってString.fromCharCodeを使って押されたキーを取得しようとしたのですが、構文エラーになってしまい、困っています。 例 入力したものが1a1→数字と認識されて横のエリアに飛ぶ 11a→三文字目が"a"だから数字でないので飛ばない <script language="JavaScript"> <!-- var str; var data; function tobu1(){ str = document.form1.txt3.value; data = str.match(/[^0-9]/g); if( str.length >= 3 && !data ) document.form1.txt4.focus(); } ・・・ <body> <INPUT type="text" name="txt2" size="3" value="" maxlength="3" onKeyUp="tobu1()" onFocus="this.select()">． <INPUT type="text" name="txt3" size="3" value="" maxlength="3" onKeyUp="tobu2()" onFocus="this.select()">． <INPUT type="text" name="txt4" size="3" value="" maxlength="3" onKeyUp="tobu3()" onFocus="this.select()">． <INPUT type="text" name="txt5" size="3" value="" maxlength="3" onFocus="this.select()">
- ベストアンサー
- JavaScript
お礼
回答ありがとうございました。 おかげでうまくいきましたー