改变/剥离URL通过图像使用JavaScript指出

可能是一个很简单的JavaScript注入的问题,但说我有一个形象的HTML标签:

<a href="myfile.htm"><img src="rainbow.gif"></a>

我想执行一个javascript,使得图像上单击时,它不会去的myfile.htm。 换句话说,我想剥离环绕IMG A HREF。 我怎样才能做到这一点在JavaScript? 有人说我引用的图像标记如下:

document.elementFromPoint(%f, %f)

F能够通过任何双/浮点值被替换

--------------解决方案-------------

如果你有一个的参考img元素,那么它的父( parentNode )将成为链接(结构中的你给)。 三个选项:

  1. 删除链接完全
  2. 禁用链接
  3. 更改链接的href

1.删​​除链接完全

你可以这样做完全删除链接:

var link = img.parentNode,
linkParent = link.parentNode;
linkParent.insertBefore(img, link);
linkParent.removeChild(link);

使用parentNode找到父母和祖父母, insertBefore移动图像,并removeChild以除去连结。 注意,这假定图像是在链路的唯一事情。

2.禁用链接

如果你想保留链接,但使其无效,你可以这样做:

var link = img.parentNode;
if (link.addEventListener) {
link.addEventListener("click", function(event) {
event.preventDefault();
}, false);
}
else if (link.attachEvent) {
link.attachEvent("onclick", function() {
return false;
});
}
else {
link.onclick = function() {
return false;
}
}

3.更改href链接:

这是微不足道的,刚才设置的href链接元素的属性(你可以得到,因为它是图像的父节点),以任何你想要的:

img.parentNode.href = /* ...something else */;

例如:

img.parentNode.href = "http://stackoverflow.com";

...将更改链接指向堆栈溢出。

活生生的例子


一些参考:

  • DOM2核心
  • DOM2 HTML
  • DOM3核心
  • HTML5 Web应用程序的API

<a id="anchorWithImage" href="myfile.htm"><img src="rainbow.gif"></a>

为什么不抢锚,然后将其HREF到什么:

var a = document.getElementById("anchorWithImage");
a.href = "javascript:void(0)";

或者抓住它,并设置其click事件取消默认操作,它是浏览它的href属性的位置

a.onclick = function(e) {
e.preventDefault();
}


或者你想抓住那有一个形象作为其子元素的所有锚,剥夺了他们的HREF?

jQuery的将使这很容易,如果这是一个选择

$("a").filter(function() {
return $(this).children("a").length === 1;
}).attr("href", "javascript:void(0)");

要么

$("a").filter(function() {
return $(this).children("a").length === 1;
}).click(function() { return false; }); //returning false from jQuery handlers
//prevents the default action


编辑

如果你有对图像的引用,并希望设置其母公司的锚的href,你会用parentNode属性抢吧:

var img = document.getElementById("imgId");
var a = img.parentNode;
a.href = "javascript:void(0)";

与jQuery你可以使用类似这样的东西

$("a").has("img").click(function(e).preventDefaults();});

基本上所有这行代码标识包含一个标签文档中的所有标签禁用标准事件过程

从另一个答案您的评论,这听起来像你真的想改变/消除链接的目标在网页中的特定位置。 你可以这样做:

var el = document.elementFromPoint(10, 10);

while(el) {
if(el.nodeName.toLowerCase() == 'a')
el.href = 'javascript:';

el = el.parentElement;
}

从所选择的元件,这将循环起来,确定如果元素是一个锚,并且设置href的东西,什么也不做。

你可以改变窗口负载本身标签的href,所以被点击时,你不用担心。

window.onload = fundtion(){
var imgs = document.getElementsByTagName('img');
for(var i=0;i<imgs.length;i++){
var parentElem = imgs[i].parentNode;
if(parentElem.tagName === 'A')
parentElem.setAttribute("href", "javascript:void(0)");
}
};

分类:JavaScript的 时间:2012-01-01 人气:0
本文关键词: JavaScript的
分享到:

相关文章

  • JavaScript对象莫名其妙地绑定到窗口和对象 2012-01-01

    我已经JavaScript对象 var Bucket = function(id) { this.id = id this.items = [] } Bucket.prototype.add_item = function(item) { //some uniquness checking code here this.items.push(item); } 出于某种原因,当我实例化对象,并尝试添加一个项目,我得到一个错误 var bct = new Bucket bct.add_item(so

  • 输入(密码)的onblur的JavaScript错误Internet Explorer 7和8 2012-01-01

    这里是我的javascript输入内嵌代码 <input type="text" value="Please type username here..." onfocus="if (this.value == 'Please type username here...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Please type use

  • 这是什么奇怪的JavaScript数组语法? 2012-01-01

    我有一些麻烦,谷歌搜索和计算器的答案是什么这段JavaScript代码是这样做的: obj['e'+type+fn]( window.event ); 对我来说,这看起来像一个参数/参数数组元素: array[index](argument); 但是,我只能猜测这是什么在做什么. 这是等同于: array[index]=argument 这是分配的一个参数数组元素? 如果有人可以提供什么这是做一个简单的/通用的例子,将是巨大的. 我试图破译约翰Resig的addEvent()的实现. 我真的不想

  • 如何在Javascript的方案? 2012-01-01

    我试图写我自己的JavaScript框架,像jQuery的. 我使用的Aptana Studio进行设计网站. 我正打算创建一个网页,写的Javascript代码,就像我们会做一个网站. 突然,我注意到的Aptana Studio还拥有一个Javascript项目. 所以,我创建了一个新的Javascript项目. 但它主要是允许你创建只有.js文件中,并没有HTML文件. 我不知道一个独立的.js文件会做什么? 我我就不会需要一个HTML文件来执行,并测试我的javascript代码? 当然,

  • EVAL的JavaScript,检查语法错误 2012-01-01

    我想知道是否有可能通过JavaScript找到,如果调用的eval()有一个语法错误或不确定的变量,等等......所以可以说我使用eval一些任意JavaScript有没有办法来捕捉错误输出该EVAL的? --------------解决方案------------- 你可以测试是否有一个错误确实是一个SyntaxError. try { eval(code); } catch (e) { if (e instanceof SyntaxError) { alert(e.message); }

  • JavaScript的:Class.method与Class.prototype.method 2012-01-01

    下面的两个声明之间的区别是什么? Class.method = function () { /* code */ } Class.prototype.method = function () { /* code using this.values */ } 是不是还好想到的第一个语句声明一个静态方法,第二个语句作为一个实例方法的声明? --------------解决方案------------- 是的,第一个函数与构造函数的对象实例没有关系,你可以认为它像一个"静态方法". 在Jav

  • 错误在JavaScript脚本的JSON字符串 2012-01-01

    我在Javascript中使用JSON在我的asp.net项目第一次. 我是新来的吧. 我已经成功地创建了页面加载一个JSON字符串,并将其存储在一个隐藏字段. 现在,在Javascript中当我尝试的eval或解析该字符串,它不解析它. 请帮忙. 以下是我正在做的: var jsonText = $("#hiddenJson").val(); var jsonObject = JSON.parse(jsonText); //var jsonObject = eval("(&

  • 从WOEID天气预报(YQL使用或RSS)在JavaScript? 2012-01-01

    有没有获得在JavaScript从WOEID预报天气的方法吗? 我尝试使用雅虎的RSS源,但无法得到它的工作. 这里是我的代码 var url = "http://weather.yahooapis.com/forecastrss?w=" + encodeURIComponent('WOEID here'); $.ajax({ url: url, dataType: 'jsonp', jsonpCallback: function(data) { console.log(data);

  • Javascript的麻烦parseFloat和的if / else循环 2012-01-01

    因此,工作的一些代码,我不与我的第二个功能是保持返回40环斑的问题,我认为循环书写正确. 我猜测它的if和else条件中传递的值? 如果(par_hour <40),其来源于parseFloat function addEmployee() { var employees = new Array(); employees[0] = window.prompt("Enter employee name","Bob"); var hours = new Array

  • Javascript链接在同一个页面打开 2012-01-01

    我如何使用JavaScript在同一页上加载的内容,而不重新加载整个页面, --------------解决方案------------- 您正在寻找所谓AJAX - 有很多的教程在那里. 最简单的方法是使用jQuery的append方法:http://api.jquery.com/append/或jQuery的文字方法:http://api.jquery.com/text/

Copyright (C) 55228885.com, All Rights Reserved.

55228885 版权所有 京ICP备15002868号

processed in 0.165 (s). 10 q(s)