JS 드 롭 다운 체크 상자 의 실현
<html>
<head>
<script src="jquery-1.7.2.min.js"></script>
<script src="jquery.easyui.min.js" ></script>
<link rel="stylesheet" href="css/themes/metro/easyui.css" ></link>
<link rel="stylesheet" href="css/themes/icon.css" ></link>
</head>
<body>
<form class="ui-forms p20" >
<input type="text" id="ysvalue" >
<fieldset>
<legend> </legend>
<div class="pt20">
<table>
<tr>
<td><label style="float: none"> </label>
<input type="text" id="byJobName" name="byJobName" value="" size="20" ></td>
<td><input type="checkbox" id="byJobName" name="byJobName" value="" size="20" > </td>
</tr>
<tr>
<td><label style="float: none"> ID</label>
<input type="text" id="byJobClass" name="byJobClass" value="" size="20" ></td>
<td><label style="float: none"> ID</label>
<input type="text" id="byJobClass" name="byJobClass" value="" size="20" ></td>
</tr>
<tr>
<td><label style="float: none"> </label>
<select id="cc" style="width:150px"></select>
<span style="white-space:pre"> </span> <div id="sp">
<span style="white-space:pre"> </span> <input type="checkbox" id="ysqu" value="01" onclick="ysqx();"><span> </span><br/>
<span style="white-space:pre"> </span> <input type="checkbox" id="lang" value="01"><span>Java</span><br/>
<span style="white-space:pre"> </span> <input type="checkbox" id="lang" value="02"><span>C#</span><br/>
<span style="white-space:pre"> </span> <input type="checkbox" id="lang" value="03"><span>Ruby</span><br/>
<span style="white-space:pre"> </span> <input type="checkbox" id="lang" value="04"><span>Basic</span><br/>
<span style="white-space:pre"> </span> <input type="checkbox" id="lang" value="05"><span>Fortran</span>
<span style="white-space:pre"> </span> </div>
</td>
<td> </td>
<td><button type="button" class="ui-button-red ui-button ui-widget ui-Status-default ui-corner-all ui-button-text-only" onclick="search();" > </button>
<button type="button" id="btnReset" name="btnReset" class="ui-button-red ui-button ui-widget ui-Status-default ui-corner-all ui-button-text-only" > </button>
</td>
</tr></table>
</div>
</fieldset>
</form>
<body>
</html>
<script type="text/javascript">
// ready select
$(function(){
$('#cc').combo({required:true,editable:false});
$('#sp').appendTo($('#cc').combo('panel'));
$('#sp input').click(function(){
var s = "";
if ($(this).attr("checked")){
//
s = $(this).next('span').text();
$('#cc').combo('setText', s);
} else {
// ， ，
for (var i=0;i<lang.length;i++ ){
if(lang[i].checked){
s = $(lang[i]).next('span').text();
break;
}
}
$('#cc').combo('setText', s);
}
});
});
//
function search(){
var value = "";
for (var i=0;i<lang.length;i++ ){
if(lang[i].checked){
value=value+lang[i].value + ",";
}
}
// ， text
ysvalue.value = value;
}
//
function ysqx(){
if (ysqu.checked) {
// ，
for (var i=0;i<lang.length;i++ ){
lang[i].checked = true;
}
} else {
//
for (var i=0;i<lang.length;i++ ){
lang[i].checked = false;
}
}
}
</script>
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
