Javascript操作class

super_loverax 2012-09-11 05:35:20

rt,比如页面中css属性中class为tip，如何操作它。



<input name="info" type="text" class="tip">

意思是，如果我鼠标焦点定位在该文本框上的时候，触发一个javascript事件，这个事件不要写在Input标签里面。可以通过操作class来实现吗。不知道我意思表达清楚了没有。

...全文

248 13 打赏收藏转发到动态举报

写回复

用AI写文章

13 条回复

切换为时间正序

请发表友善的回复…

发表回复

酒比花香 2012-09-12

打赏
举报

楼上的就可以，还不需要jquery，1楼的完全搞不懂想要表达啥。。。

s478853630 2012-09-12

打赏
举报



/**

* @see 获得对象

* @param id 对象的id(表单元素和其他标签都可以)

* @return Object

*/

function getO(id) {

	return document.getElementById(id);

}



/**

* @see 改变样式(表单元素和其他标签都可以)

* @param id 表单元素和其他标签的id

* @param css 样式的名称

*/

function changeCss(id, css) {

	if (getO(id) != null) {

		getO(id).className = css;

	} else {

		alert(id + "未定义");

	}

}

super_loverax 2012-09-12

打赏
举报

好的，谢谢了，原来用jquery可以实现。我想问下，下面的代码怎么不能执行啊。



<script src="jquery-1.5.2.min.js" type="text/javascript"></script>

<script type="text/javascript">

$("#user").focus(function()

{

alert("Hello world");

}

);

</script> 

</head>

<body>

<form id="myform" name="myform">

Info：<input type="text" name="user" id="user" />

</form>

</body>

[Quote=引用 2 楼的回复:]
简单,jquery代码:
HTML code
<input name="info" id="info" type="text" class="tip">
JScript code
$("#info").hover(
function () {
$(this).attr("class","你要变的class");//变你的class
},……
[/Quote]

s478853630 2012-09-12

打赏
举报

就芝麻大点事儿，还要把jquery引进来，不用了吧！
其实写点原始的js代码，
对浏览器的兼容性比jquery更强!

小眼 2012-09-12

打赏
举报

为啥回复一次不显示，我纠结...

小眼 2012-09-12

打赏
举报

[Quote=引用 5 楼的回复:]
好的，谢谢了，原来用jquery可以实现。我想问下，下面的代码怎么不能执行啊。

HTML code

<script src="jquery-1.5.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$("#user").focus(function()
{
alert("He……
[/Quote]

原因是你给user添加事件时，user还没加载

两个解决办法：
1、当页面加载完成后添加事件



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

<script type="text/javascript">

$(function() {

	$("#user").focus(function() {

		alert("Hello world");

	});

});

</script> 

</head>

<body>

<form id="myform" name="myform">

Info：<input type="text" name="user" id="user" />

</form>

</body>

2、使用live方法



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

<script type="text/javascript">

$("#user").live("focus", function() {

	alert("Hello world");

});

</script> 

</head>

<body>

<form id="myform" name="myform">

Info：<input type="text" name="user" id="user" />

</form>

</body>

小眼 2012-09-12

打赏
举报



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

<script type="text/javascript">

$(function() {

	$("#user").focus(function() {

		alert("Hello world");

	});

});

</script> 

</head>

<body>

<form id="myform" name="myform">

Info：<input type="text" name="user" id="user" />

</form>

</body>

2、使用live方法



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

<script type="text/javascript">

$("#user").live("focus", function() {

	alert("Hello world");

});

</script> 

</head>

<body>

<form id="myform" name="myform">

Info：<input type="text" name="user" id="user" />

</form>

</body>

a512010 2012-09-12

打赏
举报

jsAPI不能直接操作 class 需要自己写函数。

echola_2020 2012-09-12

打赏
举报

楼主是想给具有这类class的标签添加事件？
用jquery吧，选择器选中，然后进行事件处理
例如：
$('.class').bind('click',function(){});

cxw3152 2012-09-11

打赏
举报

<input name="info" id = "info" type="text" class="tip">

document.getElementById("info").attr("class","tip")

Artemis丶月 2012-09-11

打赏
举报

简单,jquery代码:



<input name="info" id="info" type="text" class="tip">



$("#info").hover(

  function () {

    $(this).attr("class","你要变的class");//变你的class

  },

  function () {

    $(this).attr("class","你要变的tip"); //变回来了

  }

);

我相信够清楚了!