如何让Jquery显示/隐藏动态div元素？

我想使用JQuery复制下面的JavaScript代码，以便页面不必刷新。我使用Jquery的主要问题是我想要选择的div根据可能有数百个评论ID而有所不同。任何帮助或建议都非常感谢！如何让Jquery显示/隐藏动态div元素？

<head> 
<script type="text/javascript"> 
<!-- 
function toggle_visibility(id) { 
    var e = document.getElementById(id); 
    if(e.style.display == 'block') 
     e.style.display = 'visible'; 
    else 
     e.style.display = 'block'; 
} 
//--> 
</script> 
</head> 
<body> 
{% for comment in comments %} 
<a href="#" onclick="toggle_visibility('make_reply_{{comment.id}}');">Reply</a> 
<div id="make_reply_{{comment.id}}"> 
<form name="titleform" action="/{{slug}}/reply/" method = "post"> 
    <input type="hidden" name="id" value="{{comment.id}}"</input> 
{% csrf_token %} 
<textarea name = "comment" value="" rows="7" cols="50"></textarea><br> 
<input type="submit" value="Submit"/> 
</form> 
</div> 
{% endfor %} 
</body>

来源

2012-05-13 user1391778

由于您使用jQuery，使用$.toggle()代替：

$('#' + id).toggle();

来源

2012-05-13 06:16:07 Sampson

HIYA 演示http://jsfiddle.net/gpwnn/

API链接：http://api.jquery.com/toggle/

代码

toggle_visibility = function (id){ 

    var e = $("#"+id); 
    e.toggle(); 
}

来源

2012-05-13 06:16:31

function toggle_visibility(id) { 
    var $e = $('#' + id); 
    if($e.is(':visible')) 
     $e.hide(); 
    else 
    $e.show(); 
}

或只是$e.toggle();

function toggle_visibility(id) { 
    var $e = $('#' + id); 
    $e.toggle(); 
}

来源

2012-05-13 06:16:56

如果我不得不这样做，我会把它以更简单的方法如下图所示：

HTML：

{% for comment in comments %} 
<div id="{{comment.id}}"> // this div will separate each iterate elements 
    <a href="#">Reply</a> // no inline method required in jquery 
    <form name="titleform" action="/{{slug}}/reply/" method = "post"> 
    <input type="hidden" name="id" value="{{comment.id}}"/> 
    <textarea name = "comment" value="" rows="7" cols="50"></textarea><br> 
    <input type="submit" value="Submit"/> 
    </form> 
</div> 
{% endfor %}

jQuery的

$('a').click(function(){ 
    $(this).next('form').toggle(); 
});

小提琴：http://jsfiddle.net/VjthL/2/

来源

2012-05-13 06:38:03

如何让Jquery显示/隐藏动态div元素？

回答

相关问题