Php 使用jquery在div之间切换
假设我有一个用户列表Php 使用jquery在div之间切换,php,ajax,Php,Ajax,假设我有一个用户列表 <a href="#">user1</a> <a href="#">user2</a> <a href="#">user3</a> 我想切换与用户相关的div内容,同时单击它,还想将该div与右下角对齐…即 用户1用户2用户3 如何使用jquery和$.ajax做到这一点据我所知,您希望异步加载用户内容: // attach this logic to the clicking of any link
<a href="#">user1</a>
<a href="#">user2</a>
<a href="#">user3</a>
我想切换与用户相关的div内容,同时单击它,还想将该div与右下角对齐…即
用户1用户2用户3
如何使用jquery和$.ajax做到这一点据我所知,您希望异步加载用户内容:
// attach this logic to the clicking of any link with class 'user'
$("a.user").click(function(e){
// prevent default behavior of link
e.preventDefault();
// gather our username from the link
var username = $(this).text();
// fire off a POST, containing our username
$.post("get-content.php", {user:username}, function(response){
// set the HTML of <div id='content'></div> to whatever was received
$("#content").html(response);
// Indicates we're expecting HTML back
}, "html");
});
-配合-
<a href="#" class="user">user1</a>
<a href="#" class="user">user2</a>
<a href="#" class="user">user3</a>
<div id="content">
Load a users details
</div>
您不一定需要使用Ajax。只需在页面上设置3个div,然后使用jQuery隐藏/显示
$(document).ready(function() {
$("div.user_div").hide(); // hides all the user divs at first, so that if someone has JS disabled they'll still see the 3 divs without the hide/show effect
$(".users a").click(function() {
$("div.user_div").hide(); // hide all divs so that only one is showing at a time
var myClass = $(this).attr("class"); // get class of the clicked link
$("div."+myClass).show(); // show the div with the same class as the clicked link
});
});
<div class="users">
<a href="#" class="user1">user1</a>
<a href="#" class="user2">user2</a>
<a href="#" class="user3">user3</a>
</div>
<div class="user_div user1">
...content...
</div>
<div class="user_div user2">
...content...
</div>
<div class="user_div user3">
...content...
</div>
如果你没有太多的div要显示/隐藏,那么Ajax可能太过了。-1这个问题需要更多信息