jquery鼠标点击,jquery鼠标点击名字自动切换

jquery怎么判断鼠标点击的是哪个div

通过JQ获取当前div的索引值可判断。

十余年的龙州网站建设经验，针对设计、前端、开发、售后、文案、推广等六对一服务，响应快，48小时及时工作处理。营销型网站的优势是能够根据用户设备显示端的尺寸不同，自动调整龙州建站的显示方式，使网站能够适用不同显示终端，在浏览器中调整网站的宽度，无论在任何一种浏览器上浏览网站，都能展现优雅布局与设计，从而大程度地提升浏览体验。创新互联从事“龙州网站设计”,“龙州网站推广”以来，每个客户项目都认真落实执行。

假设有多个div，举个例子：

$('div').on('click',function(){

var index = $(this).index($('div'));//索引值

//通个上面的index可以区分是哪个div

})

jquery模拟鼠标点击动作

trigger(type,[data])

在每一个匹配的元素上触发某类事件。

这个函数也会导致浏览器同名的默认行为的执行。比如，如果用trigger()触发一个'submit'，则同样会导致浏览器提交表单。如果要阻止这种默认行为，应返回false。

你也可以触发由bind()注册的自定义事件

返回值 jQuery

参数

type (String) : 要触发的事件类型

data (Array) : (可选)传递给事件处理函数的附加参数

示例

提交第一个表单，但不用submit()

jQuery 代码:

$("form:first").trigger("submit")

--------------------------------------------------------------------------------

给一个事件传递参数

jQuery 代码:

$("p").click( function (event, a, b) {

// 一个普通的点击事件时，a和b是undefined类型

// 如果用下面的语句触发，那么a指向"foo",而b指向"bar"

} ).trigger("click", ["foo", "bar"]);

--------------------------------------------------------------------------------

下面的代码可以显示一个"Hello World"

jQuery 代码:

$("p").bind("myEvent", function (event, message1, message2) {

alert(message1 + ' ' + message2);

});

$("p").trigger("myEvent", ["Hello","World!"]);

=====================================================================

triggerHandler(type,[data])

这个特别的方法将会触发指定的事件类型上所有绑定的处理函数。但不会执行浏览器默认动作.

返回值 jQuery

参数

type (String) : 要触发的事件类型

data (Array) : (可选)传递给事件处理函数的附加参数

示例

如果你对一个focus事件执行了 .triggerHandler() ，浏览器默认动作将不会被触发，只会触发你绑定的动作。

HTML 代码:

button id="old".trigger("focus")/button

button id="new".triggerHandler("focus")/buttonbr/br/

input type="text" value="To Be Focused"/

jQuery 代码:

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

$("input").trigger("focus");

});

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

$("input").triggerHandler("focus");

});

$("input").focus(function(){ $("spanFocused!/span").appendTo("body").fadeOut(1000); });

jquery鼠标点击事件是什么？

定义和用法：

当点击元素时，会发生 click 事件。

当鼠标指针停留在元素上方，然后按下并松开鼠标左键时，就会发生一次 click。

click() 方法触发 click 事件，或规定当发生 click 事件时运行的函数。

鼠标事件是在用户移动鼠标光标或者使用任意鼠标键点击时触发的。

1、click事件：点击鼠标左键时触发

$('p').click(function(){});

示例：

123 $('p').click(function(){        alert('click function is running !');       });

2、dbclick事件：迅速连续的两次点击时触发

$('p').dbclick(function(){});

示例：

123 $("button").dblclick(function(){ $("p").slideToggle();});

3、mousedown事件：按下鼠标时触发

$('p').mousedown(function(){});

示例

123 $("button").mousedown(function(){ $("p").slideToggle();});

4、mouseup事件：松开鼠标时触发

$('p').mouseup(function(){});

示例：

123 $("button").mouseup(function(){ $("p").slideToggle();});

5、mouseover事件：鼠标从一个元素移入另一个元素时触发

mouseout事件：鼠标移出元素时触发

$('p').mouseover(function(){});

$('p').mouseout(function(){});

示例：

123456 $("p").mouseover(function(){ $("p").css("background-color","yellow");});$("p").mouseout(function(){ $("p").css("background-color","#E9E9E4");});

6、mouseenter事件：鼠标移入元素时触发

mouseleave事件：鼠标移出元素时触发

$('p').mouseenter(function(){});

$('p').mouseleave(function(){});

示例

123456 $("p").mouseenter(function(){ $("p").css("background-color","yellow");});$("p").mouseleave(function(){ $("p").css("background-color","#E9E9E4");});

7、hover事件

$('p').hover(

function(){},

function(){}

);

示例

123456789 $(".table_list tr").hover( function () { $(this).addClass("hover"); }, function () { $(this).removeClass("hover"); } );

8、toggle事件：鼠标点击切换事件

$('p').toggle(

function(){},

function(){}

);

示例

12345678 $("p").toggle( function(){ $("body").css("background-color","green");}, function(){ $("body").css("background-color","red");}, function(){ $("body").css("background-color","yellow");}

jquery鼠标点击事件

$(".inpt").click(function(){

$this.addClass("on");

});

$("*").not(".inpt").click(function(){

$this.removeClass("on");

});

其实你可以去看看jq的hover函数

$(".inpt").hover(

function(){

$this.addClass("on");

},function(){

$this.removeClass("on");

}

);

Jquery鼠标移入和移出、点击事件,点击变色，鼠标移出又变回原来的样式

你只要明白事件触发的顺序就知道原因了：当你鼠标移到div上的时候，触发mouseenter事件，点击的时候触发click事件，然后鼠标移走触发mouseleave事件。

例如：var

test=0;

$("#div1").delegate("a",

"mouseenter",

function()

{

test=1;

}).delegate("a",

"mouseleave",

function()

{

test=2;

});

$("#div1").delegate("a",

"click",

function()

{

test=3;

});

当你鼠标移动到div上点击之后鼠标再移走，最后触发的事件是mouseleave事件，此时test是2而不是三。你可以测试一下

jquery如何实现鼠标点击事件（如同手风琴效果，但是点击一次被点击的背景变化，点击第二次恢复到原来背景

ul

lih4123/h4div class="hidden"aaa/div/li

lih4456/h4div class="hidden"bbb/div/li

/ul

script type="text/javascript"

$("li").click(function(event){

$(this).toggleClass("show");

$(this).find("div").toggle();

$(this).siblings().find("div").hide();

$(this).removeClass("show");

})

/script

这是我写的例子 能否满足你的要求

参考资料：