Writing /volume1/Web/Public/dokuwiki/data/log/deprecated/2024-11-14.log failed

現在位置: start » study » javascript » jquery » select

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

両方とも前のリビジョン前のリビジョン
次のリビジョン		前のリビジョン
study:javascript:jquery:select [2010/10/02 12:29] – bananastudy:javascript:jquery:select [2021/03/03 01:30] (現在) – [Test　Page] banana
行 3: 行 3:
 まずはデモから見てみよう。 まずはデモから見てみよう。
  
-===== Test　Page =====+===== Test Page =====
 <html> <html>
 <head> <head>
行 78: 行 78:
 <html> <html>
 <head> <head>
-<script type="text/javascript" src="./test/js/jquery-1.4.2.js"></script>+<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
 <script type="text/javascript"> <script type="text/javascript">
 <!-- <!--
 function showValue(){ function showValue(){
-  alert($("#example").val());+  alert($("#example1").val());
 } }
 function showText(){ function showText(){
-  alert($("#example :selected").text());+  alert($("#example1 :selected").text());
 } }
 +
 +function showIndex() {
 +  alert($("#example1").get(0).selectedIndex);
 +}
 +
 +function setValue() {
 +  //selectedはずす
 +  $("[name='entry[0].queNo'] option").attr("selected", false);
 +  $("[name='entry[0].queNo']").val("3");
 +}
 +
 +function queChange(obj) {
 +  var selected = $(obj).get(0).selectedIndex;
 +  $(obj).find("option").attr("selected", false);
 +}
 +
 //--> //-->
 </script> </script>
 </head> </head>
 <body> <body>
-<select id="example">+<select id="example1" name="entry[0].queNo" onchange="queChange(this);">
 <option value="1">This is the first item.</option> <option value="1">This is the first item.</option>
 <option value="2" selected="selected">This is the second item.</option> <option value="2" selected="selected">This is the second item.</option>
行 98: 行 114:
 <input type="button" name="test1" value="selected value" onclick="showValue();"/> <input type="button" name="test1" value="selected value" onclick="showValue();"/>
 <input type="button" name="test2" value="selected text" onclick="showText();"/> <input type="button" name="test2" value="selected text" onclick="showText();"/>
 +<input type="button" name="test3" value="selected index" onclick="showIndex();"/>
 +<input type="button" name="test4" value="select 3rd item" onclick="setValue();"/>
 </body> </body>
  
行 104: 行 122:
 コードの一部を次に示す。 コードの一部を次に示す。
 <code Javascript> <code Javascript>
-  $("#example").val(); +  $("#example1").val(); 
-  $("#example :selected").text();+  $("#example1 :selected").text(); 
 +  $("#example1").get(0).selectedIndex
 </code> </code>
  
行 111: 行 130:
   - [[http://www.electrictoolbox.com/jquery-add-option-select-jquery/|Add a new option to a select with jQuery]]   - [[http://www.electrictoolbox.com/jquery-add-option-select-jquery/|Add a new option to a select with jQuery]]
   - [[http://d.hatena.ne.jp/x6x6/20080318/1205817536|jQueryでoption要素を追加した際の諸問題]]   - [[http://d.hatena.ne.jp/x6x6/20080318/1205817536|jQueryでoption要素を追加した際の諸問題]]
 +  - [[http://www.c-sharpcorner.com/blogs/BlogDetail.aspx?BlogId=1214|JQuery Tutorial:3 ways to access the selection in an HTML drop down list box]]
  
 +~~DISCUSSION~~
  

トレース:

QR Code
QR Code study:javascript:jquery:select (generated for current page)