티스토리 뷰

Language/JQuery

[ JQuery ] radio change 연결

MiniNeko 2015. 11. 29. 05:13

if($txtGubun=="") { $txtGubun = "1"; }
// 1 : 종류 // 2 : 지역
?>
< script>
$(function() {
   $( "#radio" ).buttonset();    // JQuery UI
   $( "#radio" ).bind("change", gubunHandler);    // bind 로 change 함수 연결
});
function gubunHandler() {
   //alert("bind : " + $(":radio[name=txtGubun]:checked").val());
   formRadio.submit();
}
< /script>

< form name="formRadio" action="/CMS/">
< input type="hidden" name="menuFirst" value="menu" />
< div id="radio">
   <input type="radio" id="radio1" name="txtGubun" value="1" <?if($txtGubun=="1") echo "checked='checked'";?>><label for="radio1">종류</label>
   <input type="radio" id="radio2" name="txtGubun" value="2" <?if($txtGubun=="2") echo "checked='checked'";?>><label for="radio2">지역</label>
   <input type="radio" id="radio3" name="txtGubun" value="3" <?if($txtGubun=="3") echo "checked='checked'";?>><label for="radio3">Choice 3</label>
< /div>
< /form>
< br />

======================================================================

< script language='javascript'>
 
      $(document).ready(function() {
          $("#testddl").bind("change", fn_selectChange)  //bind 로 change 함수 연결
          $("#testddl").change(function() {  //change 함수
              alert($(this).val());
          });
          
          $("input[name=testradio]").bind("click", fn_radioClicks)  //bind 로 click 함수 연결
          $("input[name=testradio]").click(function() {  //click 함수
              alert($(this).val());
          });
      });
 
      function fn_selectChange()
     {
           alert("bind : " + $(this).val());
      }
 
      function fn_radioClicks() 
      {
           alert("bind : " + $(this).val());
      }

< /script>
 
< form id=form1>
 
< select name="testddl">
      <option value="1 Year" selected="selected">1 Year</option>
      <option value="2 Years">2 Years</option>
      <option value="3 Years">3 Years</option>
< /select>
 
< !--특히 멀티 control 을 제어할 때는 name 으로 제어해야 한다.-->
< input type="radio" name="testradio" value="1" />
< input type="radio" name="testradio" value="2" />
< input type="radio" name="testradio" value="3" />
< input type="radio" name="testradio" value="4" />
< input type="radio" name="testradio" value="5" /> 
< /form>
[출처] jQuery select, radio 의 change, click event|작성자 바람 

Total
Today
Yesterday
최근에 올라온 글
«   2025/01   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31