==============================
楼主并未说明是否需要支持多浏览器,大家都知道,不同浏览器下JS的写法是不一样的,我自然不会搞的那么复杂还专门去到火狐或其它浏览器下去测试一下,毕竟在这里给人回答问题只是爱好所致。之前的代码仅在IE6.0下测试通过,你可以去IE6下执行看看。
修改后的代码在IE和firefox下均测试通过,如果你还要支持其它浏览器的话,请自行修改浏览器支持。
================
<HTML>
<HEAD>
<TITLE>New Document </TITLE>
<script language="javascript">
//使火狐支持insertAdjacentHTML 方法
if(typeof HTMLElement!="undefined" &&!HTMLElement.prototype.insertAdjacentElement)
{
HTMLElement.prototype.insertAdjacentElement = function(where,parsedNode)
{
switch (where)
{
case 'beforeBegin':
this.parentNode.insertBefore(parsedNode,this)
break
case 'afterBegin':
this.insertBefore(parsedNode,this.firstChild)
break
case 'beforeEnd':
this.appendChild(parsedNode)
break
case 'afterEnd':
if (this.nextSibling) this.parentNode.insertBefore(parsedNode,this.nextSibling)
else this.parentNode.appendChild(parsedNode)
break
}
}
HTMLElement.prototype.insertAdjacentHTML = function (where,htmlStr)
{
var r = this.ownerDocument.createRange()
r.setStartBefore(this)
var parsedHTML = r.createContextualFragment(htmlStr)
this.insertAdjacentElement(where,parsedHTML)
}
HTMLElement.prototype.insertAdjacentText = function (where,txtStr)
{
var parsedText = document.createTextNode(txtStr)
this.insertAdjacentElement(where,parsedText)
}
}
var moveDiv
var oldX
var oldY
function down(div,event){
moveDiv = div
if(getBrowserType() == "fox"){
oldX = event.pageX
oldY = event.pageY
}else{
oldX = event.x
oldY = event.y
}
if(getBrowserType() == "fox"){
document.addEventListener("mousemove",move,true)
}else{
div.setCapture()
}
}
function move(event){
if(null!=moveDiv){
var oldXtemp = parseInt(moveDiv.style.left)
var oldYtemp = parseInt(moveDiv.style.top)
if(getBrowserType() == "fox"){
oldXtemp = oldXtemp + event.pageX-oldX
moveDiv.style.left = oldXtemp
oldX = event.pageX
oldYtemp = oldYtemp + event.pageY - oldY
moveDiv.style.top = oldYtemp
oldY = event.pageY
}else{
oldXtemp = oldXtemp + event.x-oldX
moveDiv.style.left = oldXtemp
oldX = event.x
oldYtemp = oldYtemp + event.y - oldY
moveDiv.style.top = oldYtemp
oldY = event.y
}
}
}
function up(divObj){
if(null!=moveDiv){
if(getBrowserType() == "fox"){
document.removeEventListener("mousemove",move,true)
}else{
moveDiv.releaseCapture()
}
moveDiv = null
}
}
function getBrowserType(){
var browser=navigator.appName
var b_version=navigator.appVersion
var version=parseFloat(b_version)
if ((browser=="Netscape")){
return "fox"
}else if(browser=="Microsoft Internet Explorer"){
if(version>=4){
return "ie4+"
}else{
return "ie4-"
}
}else{
return "NSupport"
}
}
var divNum = 0
function add(){
var tipStr = document.getElementById("mytip").value
var divHtmlArr = new Array()
divHtmlArr.push("<div id=\"div"+divNum+"\" ")
divHtmlArr.push("style=\"border:1px solid #BDD2EDposition:absoluteleft:10pxtop:10pxwidth:100pxheight:100pxbackground-color:#ff0000\" ")
divHtmlArr.push("onmousedown=\"down(this,event)\" ")
divHtmlArr.push("onmousemove=\"move(event)\" onmouseup=\"up(this)\">"+tipStr+"</div>")
document.body.insertAdjacentHTML("afterBegin",divHtmlArr.join(''))
divNum++
}
/*
<div id="div1" style="border:1px solid #BDD2EDposition:absoluteleft:10pxtop:10pxwidth:100pxheight:100pxbackground-color:#ff0000" onmousedown="down(this,event)" onmousemove="move(event)" onmouseup="up(this)">aaaaaaaaa</div>
<div id="div2" style="border:1px solid #BDD2EDposition:absoluteleft:110pxtop:20pxwidth:100pxheight:100pxbackground-color:#23df00" onmousedown="down(this,event)" onmousemove="move(event)" onmouseup="up(this)">bbbbb</div>
<div id="div3" style="border:1px solid #BDD2EDposition:absoluteleft:320pxtop:230pxwidth:100pxheight:100pxbackground-color:#031d30" onmousedown="down(this,event)" onmousemove="move(event)" onmouseup="up(this)">cccc</div>
<div id="div4" style="border:1px solid #BDD2EDposition:absoluteleft:220pxtop:80pxwidth:100pxheight:100pxbackground-color:#0033de" onmousedown="down(this,event)" onmousemove="move(event)" onmouseup="up(this)">dddddd</div>
<div id="div5" style="border:1px solid #BDD2EDposition:absoluteleft:150pxtop:440pxwidth:100pxheight:100pxbackground-color:#87190f" onmousedown="down(this,event)" onmousemove="move(event)" onmouseup="up(this)">eeeee</div>
*/
</script>
</HEAD>
<BODY>
<input type="text" id="mytip" value="mytip">
<input type="button" value="add a new tip" onclick="add()">
</BODY>
</HTML>
获取a标签元素,然后后面.click()即可.
给个例子把:
<!doctype html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<a href="这里是a标签的路径">这里是a标签的名称</a>
<button onclick="fn()">点击打开a标签</button>
<script>
var a = document.getElementsByTagName('a')[0]
function fn(){
a.click()
}
</script>
</body>
</html>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)