JQ给添加属性的问题

KeenWon 2011-09-07 09:10:23

小弟我遇到个问题
这个算是个JQ的相册



        <script type="text/javascript">

		$(document).ready(function(){

		    $("a[rel='example1']").colorbox();

		});

	</script>

html是这个



<p><a href="ohoopee1.jpg" rel="example1" title="Me and my grandfather on the Ohoopee.">Grouped Photo 1</a></p>

<div style="display:none">

<p><a href="ohoopee2.jpg" rel="example1" title="On the Ohoopee as a child">Grouped Photo 2</a></p>

<p><a href="ohoopee3.jpg" rel="example1" title="On the Ohoopee as an adult">Grouped Photo 3</a></p>

</div>

凡是有rel="example1"的属性的链接,都能以相册的形式显示

现在的问题是我有两个导航,水平的和垂直的,两个地方都是第一张图片的<a></a>,其他的放到display:none的div里,这样就有两个第一张图片了,我想用JQ在鼠标mouseover的时候给<a></a>加上rel="example1"代码是



$("#abc").mouseover(function () {

		        $("#abc").attr("rel", "example1");

		    });

应该可以加上rel属性,但是没有效果,该怎么解决??

...全文

531 11 打赏收藏转发到动态举报

写回复

用AI写文章

11 条回复

切换为时间正序

请发表友善的回复…

发表回复

001007009 2011-09-07

打赏
举报

$(document).ready(function () {
$("a[rel='example1']").colorbox();
$("#abc").mouseover(function () {
$("#abc").attr("rel", "example1");
});
});

之所以动态添加的rel没反应，是因为页面加载时只加载了rel有值的元素，至于之后动态添加的rel，它就不管了。

[Quote=引用 8 楼 calmcrime 的回复:]
$("#abc").live('mouseover',function () {
$("#abc").attr("rel", "example1");
});

楼主这样试试，，因为有些a是之后动态赋予的rel属性，得加上live
[/Quote]

这样是用在普通事件中。

对于 $("a[rel='example1']").colorbox(); 这样的话，也许得改colorbox()这个了

KeenWon 2011-09-07

打赏
举报

哦,我明白了...我找到原因了
加一个



$("#abc").click(function () {

	            $("a[rel='example1']").colorbox();

	        });

现在jq是这样的



<script type="text/javascript">

	    $(document).ready(function () {

	        $("#abc").click(function () {

	            $("a[rel='example1']").colorbox();

	        });

	        $("a[rel='example1']").colorbox();

	        $("#abc").mouseover(function () {

	            $("#abc").attr("rel", "example1");

	        });

	    });

	</script>

谢谢各位

三石-gary 2011-09-07

打赏
举报

它本来就有一个 rel="111" 不知道是不是这个原因

001007009 2011-09-07

打赏
举报

$("#abc").live('mouseover',function () {
$("#abc").attr("rel", "example1");
});

楼主这样试试，，因为有些a是之后动态赋予的rel属性，得加上live

KeenWon 2011-09-07

打赏
举报

事实证明rel="example1"加上去了,但是直接点击这样的<a></a>没效果
直接写上就有效果
请问jq加属性和直接写有什么区别吗?

KeenWon 2011-09-07

打赏
举报

[Quote=引用 5 楼 zsx841021 的回复:]

能把有关#abc 的代码贴一下吗
[/Quote]



<html>

<head>

	<title>测试</title>

<link media="screen" rel="stylesheet" href="colorbox.css" />

	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>

	<script type="text/javascript" src="../colorbox/jquery.colorbox.js"></script>

	<script type="text/javascript">

	    $(document).ready(function () {

	        $("a[rel='example1']").colorbox();

	        $("#abc").mouseover(function () {

	            $("#abc").attr("rel", "example1");

	        });

	    });

	</script>

</head>

<body>

	<p><a href="../content/ohoopee1.jpg" id="abc" class="a1" rel="111" title="Me and my grandfather on the Ohoopee.">Grouped Photo 1</a></p>

	<div style="display:none;">

	    <p><a href="../content/ohoopee2.jpg" rel="example1" title="On the Ohoopee as a child">Grouped Photo 2</a></p>

	    <p><a href="../content/ohoopee3.jpg" rel="example1" title="On the Ohoopee as an adult">Grouped Photo 3</a></p>

    </div>

</body>

</html>

三石-gary 2011-09-07

打赏
举报

能把有关#abc 的代码贴一下吗

KeenWon 2011-09-07

打赏
举报

[Quote=引用 1 楼 calmcrime 的回复:]

HTML code

<a id="test">123</a>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script language="JavaScript">
$('#test').attr('rel……
[/Quote]
这些都写了,我试了,可以加title,加class,应该也能加rel,但是就是不能显示相册的效果...直接写上rel="example1"就可以..

KeenWon 2011-09-07

打赏
举报

[Quote=引用 2 楼 zsx841021 的回复:]

#abc 这个<a>放在哪的 <div>里？
[/Quote]
这个就是链接,放到导航里,其他的藏起来

三石-gary 2011-09-07

打赏
举报

#abc 这个<a>放在哪的 <div>里？

001007009 2011-09-07

打赏
举报



<a id="test">123</a>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<script language="JavaScript">

	$('#test').attr('rel','123')

</script>

可以啊，是不是dom没加载上？