1. 爱易网页
  2. Java教程
  3. JavaScript。偏题，人在线

JavaScript。偏题，人在线

日期：2014-05-18　 浏览次数：20758 次

JavaScript。。难题，人在线
HTML code

<table width="157" height="141" border="1">
  <tr>
    <td bgcolor="#FFFFFF"><div align="center">A</div></td>
    <td bgcolor="#FFFFFF"><div align="center">B</div></td>
  </tr>
  <tr>
    <td><div align="center">D</div></td>
    <td><div align="center">E</div></td>
  </tr>
</table>


单鼠标点击图片A的时候并移动到图片E处，然后松开鼠标，要使此时A与E的位置调换。同理其他图片也可以这样互相移动。。。

------解决方案--------------------
<head>
<script type = "text/javascript">

var pointFirst;
var pointSecond;

var first;
var second

function onClick(id){  
first = id;
pointFirst = document.getElementById(id).innerText;
}

function onMouseUp(id){
second = id;
pointSecond = document.getElementById(id).innerText;
tempImageChange();
}

function tempImageChange(){  
document.getElementById(first).innerText = pointSecond;
document.getElementById(second).innerText = pointFirst;
}

</script>
</head>

<table width="157" height="141" border="1">
<tr>
<td id="aId" bgcolor="#FFFFFF" onmousedown ="onClick('aId')" onmouseup="onMouseUp('aId')" value="a"><div align="center">A</div></td>
<td id="bId" bgcolor="#FFFFFF" onmousedown ="onClick('bId')" onmouseup="onMouseUp('bId')"><div align="center">B</div></td>
</tr>
<tr>
<td id = "dId" onmousedown ="onClick('dId')" onmouseup="onMouseUp('dId')"><div align="center">D</div></td>
<td id = "eId" onmousedown ="onClick('eId')" onmouseup="onMouseUp('eId')"><div align="center">E</div></td>
</tr>
</table>

上面的原理差不多！

相关资料更多>

  1. jsp对于文件读写的小疑点
  2. 程序员要写多少年代码才能写出房子 写出车子 写出gf,该如何处理
  3. java想找到字符串中最后一个英文字符的位置
  4. 问一个java连接数据库，操作表的有关问题，在什么地方添加数据库数据啊
  5. java 字符型与long部类的转换
  6. 用eclipse急需配置环境变量吗
  7. 在linux系统下，页面不显示,该怎么解决
  8. 会编译，但运行到一半死活没反应，求解
  9. strust2 No result defined for action and result input有关问题