죄송합니다. jquery를 사용하여 아직 새로운 질문이므로 쉬운 질문 일 수 있습니다. 내가 div 태그를 숨길 버튼과 함께 테이블에 div 태그를 설정하려고합니다. 각 div 태그에 id 태그를 사용하여 작동시키는 방법을 알았지 만 무제한 버튼 (100 개 이상)을 처리 할 수있는 클래스와 같은 것이 필요합니다. 여기 내가 시도한 것이있다. 나는 자바 스크립트 코드를 동적 반환 코드에 넣었다. 버튼 1이 작동하고 버튼 5 6이 보이지만 작동하지 않습니다.동적으로 생성 된 div 태그를 동적으로 숨기는 방법은 무엇입니까?
나는 올바른 방향으로 나를 가리킨 분이 있는지보십시오.
감사
code.html
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript"> //<![CDATA[
$(document).ready(function() {
$("#remove0").click(function() {
var checkattrib = $(this).attr("src");
if (checkattrib != "ajax-loader.gif") {
$(this).attr("src", "ajax-loader.gif");
mytimer0 = setTimeout(delayme0,1000);
} else {
$(this).attr("src", "req/icons/icon_checknotok.gif");
clearTimeout(mytimer0);
}
return false;
});
function delayme0() {
$("#alert0").hide();
$.post("update.php", { mydata: "654321" },
function(data) {
document.getElementById("dynamiccode").innerHTML=data;
});
return false;
}
$("#remove1").click(function() {
var checkattrib = $(this).attr("src");
if (checkattrib != "req/icons/icon_waitani.gif") {
$(this).attr("src", "req/icons/icon_waitani.gif");
mytimer1 = setTimeout(delayme1,1000);
} else {
$(this).attr("src", "req/icons/icon_checknotok.gif");
clearTimeout(mytimer1);
}
return false;
});
function delayme1() {
$("#alert1").hide("clip", 1000);
$.post("update.php", { mydata: "445566" });
return false;
}
});
//]]>
</script>
</head>
<body>
<div id='alert0'>
<table><tr><td>
Button 1: <input type="image" title="Remove Alert" src="req/icons/icon_checknotok.gif" value="" id="remove0" />
</td></tr></table>
</div>
<div id='alert1'>
<table><tr><td>
Button 2: <input type="image" title="Remove Alert" src="req/icons/icon_checknotok.gif" value="" id="remove1" />
</td></tr></table>
</div>
</form>
<div id='dynamiccode'></div>
<br />
update.php
// read data from database with id tag from ajax
// return new data
print <<<END
<script type="text/javascript"> //<![CDATA[
$("#removealert1).click(function() {
var checkattrib = $(this).attr("src");
if (checkattrib != "ajax-loader.gif") {
$(this).attr("src", "ajax-loader.gif");
delaydyn1 = setTimeout(delaydyn,1000);
} else {
$(this).attr("src", "req/icons/icon_checknotok.gif");
clearTimeout(delaydyn1);
}
return false;
});
function delaydyn() {
$("#alerttable").hide();
$.post("update.php", { mydata: "1001010" });
return false;
}
});
//]]>
</script>
<div id='alerttable'>
<table><tr><td>
Button 5: <input type="image" title="Remove Alert" src="req/icons/icon_checknotok.gif" value="" id="removealert1 />
</td></tr></table>
</div>
<script type="text/javascript"> //<![CDATA[
$("#removealert2").click(function() {
var checkattrib = $(this).attr("src");
if (checkattrib != "ajax-loader.gif") {
$(this).attr("src", "ajax-loader.gif");
delaydyn2 = setTimeout(delaydyn2,1000);
} else {
$(this).attr("src", "req/icons/icon_checknotok.gif");
clearTimeout(delaydyn2);
}
return false;
});
function delaydyn2() {
$("#alerttable2").hide();
$.post("update.php", { mydata: "1001010" });
return false;
}
});
//]]>
</script>
<div id='alerttable'>
<table><tr><td>
Button 6: <input type="image" title="Remove Alert" src="req/icons/icon_checknotok.gif" value="" id="removealert2" />
</td></tr></table>
</div>
END;
솔직히 말해서 ...이 코드는 당신의 사고 과정에없는 외부인에게 꽤 밀집되어 있습니다. 중요한 부분 만 짝을 지어 더 나은 의도를 설명 할 수 있습니까? – clifgriffin
clif에 동의합니다. 구체적인 제안을하기가 어렵습니다.그러나 클래스 이름, * this * 및 부모/자식 함수를 포함하여 올바른 요소를 선택하는 데 사용할 수있는 도구가 많이 있습니다. 따라서 div에 div가 숨겨져 있어야하는 버튼이 있다면 $ (this) .parent(). hide()를 예로들 수 있습니다. – Mayo
hehehe ... 나는 그것을 좁히려 고 시도했다. 나는 그것이 다소 복잡하다고 생각한다. 그것이 내가 모든 것을 게시 할 것이라고 생각한 이유이며 테스트를 위해 텍스트 파일로 복사 할 수 있습니다. – Jared