티스토리 뷰

사용안함

jquery select,checkbox 중복체크

제부도소년 2010.01.25 17:42
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  
<? include "../Anyjquery/jquery_inc.php"; ?>
<script language="javascript">
$(function(){
$("input[name='check_fruit']:checkbox").click(function(){
checkedlist="";
$("#select_fruit>option").removeAttr("selected");
$("input[name='check_fruit']:checkbox:checked").each(function(){
$("#select_fruit>option[value='"+$(this).val()+"']").attr("selected","selected");
checkedlist+=$(this).val()+", ";
//checkedlist+=$(this).parent().prev().text()+", ";
})
$("#multi_fruit").val(checkedlist);
});

$("#select_fruit").change(function(){
checkedlist="";
$("input:checkbox").removeAttr("checked");
$("#select_fruit option:selected").each(function(){
$("input:checkbox[value='"+$(this).val()+"']").attr("checked","checked");
checkedlist+=$(this).val()+", ";
})
$("#multi_fruit").val(checkedlist);
});
//select_list
//check_list
$("#select_list").hide();

$("#check_button").click(function(){
$("#select_list").hide("slow");
$("#check_list").show("slow");
});

$("#select_button").click(function(){
$("#check_list").hide("slow");
$("#select_list").show("slow");
});
});
</script>
 </HEAD>

 <BODY>
<table>
<tr>
<td>
<div id="check_list">
글쓴이 <input type="checkbox" name="check_fruit" value="글쓴이">
제목 <input type="checkbox" name="check_fruit" value="제목">
내용 <input type="checkbox" name="check_fruit" value="내용">
</div>
<br>
<div id="select_list">
<select id="select_fruit" multiple size="3">
<option value="글쓴이">글쓴이</option>
<option value="제목">제목</option>
<option value="내용">내용</option>
</select>
</div>
<br>
<div>
<input type="text" id="multi_fruit">
</div>
<br>
<div id="result">
<input type="button" id="check_button" value="checkbox 형태로 바꾸기">
<input type="button" id="select_button" value="select 형태로 바꾸기">
</div>
</td>
</tr>
</table>
  
 </BODY>
</HTML>

'사용안함' 카테고리의 다른 글

jquery ui 적용사례  (2) 2010.01.30
jquery 로그인창  (0) 2010.01.30
jquery select,checkbox 중복체크  (0) 2010.01.25
jquery 유효성검사  (0) 2010.01.25
jquery 테이블 색변경  (0) 2010.01.25
php 에서 date 형식 종류  (0) 2010.01.22
댓글
댓글쓰기 폼