Question

我只想在使用AJAX按下按钮时交换两个div的内容。

我做了一个简单的jsfiddle只是为了证明我的意思。因此，我想使用onclick将A与B和B同时交换（同时红色和绿色框保持在同一位置）。

.box1 {
  border: 2px solid green ;
}

.box2 {
  border: 2px solid red ;
}

<div id="rank1" class="box1">
  B
</div>
    
<div id="rank2" class="box2">
  A
</div>

Answer 1

使用jquery执行此操作

在html head标签中包含jquery js

<script  type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>

并按照脚本更改内容

<script>
  $(document).ready(function(){
    $('#sbutton').click(function() {
        var div1_value = $( "#rank1" ).html();
        var div2_value = $( "#rank2" ).html();
        $( "#rank1" ).html(div2_value);
        $( "#rank2" ).html(div1_value)
    });
  });
</script>

在html正文中添加一个按钮

<input type="button" id="sbutton" value="Change"/>

使用AJAX交换div内容

1 个答案: