jquery 或者js 怎么获取页面光标所在的元素

jquery 或者js 怎么获取页面光标所在的元素,第1张

需要准备的材料分别有:电脑、html编辑器、浏览器。

1、首先,打开html编辑器,新建html文件,例如:indexhtml,编写基础代码

2、在indexhtml中的<script>标签,输入js代码:

var el = windowdocumentbody;

windowdocumentbodyonmouseover = function(event) {

el = eventtarget;

$('body')append('<br/>当前鼠标在' + $(el)html() + '元素上');

}

3、浏览器运行indexhtml页面,此时鼠标移动到123上,会打印出光标在123元素上。

jQuery 的 index() 方法返回指定元素相对于其他指定元素的索引值,注意:索引值是从0开始计数的。获得当前元素的索引值可用click事件触发

示例代码如下:获取被点击的a标签的索引值

1,创建Html元素

2,设置css样式

3,编写jquery代码

4,观察效果:因为index从0开始计数,所以点击第三个元素,获取的索引值是2

扩展资料

jQuery的核心特性:

1,具有独特的链式语法和短小清晰的多功能接口;

2,具有高效灵活的css选择器,并且可对CSS选择器进行扩展;

3,拥有便捷的插件扩展机制和丰富的插件。

4,jQuery兼容各种主流浏览器,如IE 60+、FF 15+、Safari 20+、Opera 90+等。

参考资料:

jQuery - 百度百科

jquery

radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关

获取一组radio被选中项的值

var

item

=

$('input[name=items][checked]')val();

获取select被选中项的文本

var

item

=

$("select[name=items]

option[selected]")text();

select下拉框的第二个元素为当前选中值

$('#select_id')[0]selectedIndex

=

1;

radio单选组的第二个元素为当前选中值

$('input[name=items]')get(1)checked

=

true;

获取值:

文本框,文本区域:$("#txt")attr("value");

多选框checkbox:$("#checkbox_id")attr("value");

单选组radio:

$("input[@type=radio][@checked]")val();

下拉框select:

$('#sel')val();

控制表单元素:

文本框,文本区域:$("#txt")attr("value",'');//清空内容

$("#txt")attr("value",'11');//填充内容

多选框checkbox:

$("#chk1")attr("checked",'');//不打勾

$("#chk2")attr("checked",true);//打勾

if($("#chk1")attr('checked')==undefined)

//判断是否已经打勾

单选组radio:

$("input[@type=radio]")attr("checked",'2');//设置value=2的项目为当前选中项

下拉框select:

$("#sel")attr("value",'-sel3');//设置value=-sel3的项目为当前选中项

$("<option

value='1'>1111</option><option

value='2'>2222</option>")appendTo("#sel")//添加下拉框的option

$("#sel")empty();//清空下拉框

试一下这个把,我刚才试过了,可以的

var tt=$("form select[name=selectName]")find('option:selected')text();

alert(tt);

把selectName换成你表单中的下拉框name值就行了

要是使用ID查询这样就行了

var tt=$("#selectId")find('option:selected')text();就行

在head中引用jquery:

<script type="text/javascript" src="/js/jquery-171minjs"></script>

2定义一个text输入框:

<input type="text" value="" id="inputValue"/>

3在自定义函数中根据id获取此text的值:

var temp = $('#inputValue')val();//获取值

alert(temp);//显示

4将输入的 字符串根据 ","分割:

var temp = $('#inputValue')val();

var getStr = tempsplit(",");

5定义一个对象,并打印输入这个对象的值:

var jsonData = {};

jsonDataMainCmdID = 9100;//游戏消息 MDM_GF_GAME

jsonDataSubCmdID = 9012;//用户出牌SUB_C_OUT_CART_WEB

jsonDataChairID = 0;

jsonDataCardCount = getStrlength;

jsonDataCardData = temp;

var str = JSONstringify(jsonData);

alert(str);

输出 text中输入的值:

输出一个对象的值:

如下代码可以实现点击页面获得被点击元素的id

$(document)click(function(e) { // 在页面任意位置点击而触发此事件

  $(etarget)attr("id");       // etarget表示被点击的目标

})

示例代码如下

创建Html元素

<div class="box">

<span>点击页面后,设置被点击元素背景色并获取其id:</span><br>

<div class="content" id = "test">test

<div id = "test1">test1

<div id = "test2">test2

<div id = "test3">test3</div>

</div>

</div>

</div>

</div>

设置css样式

divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}

divbox span{color:#999;font-style:italic;}

divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}

divcontent div{min-width:20px;min-height:20px;padding:30px;border:1px solid #446699;background:#ffffff;}

bg{background:#ff99cc !important;}

编写jquery代码

$(function(){

$(document)click(function (e) {

$(etarget)addClass('bg');     // 设置背景色

alert($(etarget)attr('id'));  // 获取id

})

})

观察效果

初始状态

点击id为test2的div

以上就是关于jquery 或者js 怎么获取页面光标所在的元素全部的内容,包括:jquery 或者js 怎么获取页面光标所在的元素、jquery中怎么获得当前元素的索引值、jquery获取元素值的方法(常见的表单元素)等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9739517.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-01
下一篇 2023-05-01

发表评论

登录后才能评论

评论列表(0条)

保存