SmartDog

沒有廢話的JQuery

        發現身邊的朋友在用 JavaScript 時，很多用 document.getElementById() 的方式在寫，並不是說這樣不好，而是既然JQuery有提供更好的方式，其實可以試著用用看，真的不想花時間學 JQuery 的話，那至少可以直接 Copy 本篇文章去用，用久了也就知道他的好處了。

---

完整範例下載：SampleJQuery.zip

---

	    //--這一行的意思是說，等網頁全都戴完了才做裡面的事 (小誤：應該是等 DOM 建立完畢，搞不清楚就照打就對了)
        $(document).ready(
            function() {
				
				//--取得某個 ID 的項目  
				//原本應該寫成 var textbox1_sample = document.getElementById('textbox1');
				//--                      ↓現在只要打成這樣，好歹少打很多字吧？
				var textbox1_sample = $('#textbox1');
				//                       ↑記得id 前面要加 # 號喔！
				
				//--以下是比較正式的用法--------------------------------------------------------

                //--從Text取出值         ↓從 id = 'textbox1' 取出 value  不難吧？   其他的以此類推
				var textbox1_value = $("#textbox1").val();
				//--把值alert 出來
                $("#button1").click(function() { alert($("#textbox1").val()); });

                //--從 Select 取出選取的值
				var select1_value = $("#select1 option:selected").val();
                $("#button2").click(function() { 
                              alert($("#select1 option:selected").val()); 
                });

                //--從 Select 取出所有的值
                $("#button3").click(function() {
                    var str = "";
                    //--如果要選全部的值使用  "#select2 option"
                    $("#select2 option:selected").each(function() {
                        str += $(this).text() + "-";
                    });
                    alert(str.slice(0, (str.length - 1)));
                });

                //--從CheckBox中取得勾選的值
                $("#button4").click(function() {
                    var str = "";
                    //--name可以改成任何自定的屬性
                    $("input[name='group1']:checked").each(function() {
                        str += $(this).val() + "-";
                    });
                    alert(str.slice(0, (str.length - 1)));
                });

                //--從RadioButton中取得勾選的值
                $("#button5").click(function() {
                    alert($("input[name='group2']:checked").val());
                });
				
				//--用 Ajax 使用 get 取出選取的值
				$.get("ncs_to_most.asp", 
				      { FileName: "Organize", TagName: "Org1" }, 
					   function (data) 
					   { $("span[id='AjaxUsingGet']").text(data); }
					  );
            });