js怎样获取点击的是第几个li
发布网友
发布时间:2022-04-22 12:33
我来回答
共3个回答
热心网友
时间:2022-04-26 01:32
<!DOCTYPE html>
<head>
<style type="text/css">
ul{
list-style:none; /* 去掉ul前面的符号 */
margin: 0px; /* 与外界元素的距离为0 */
padding: 0px; /* 与内部元素的距离为0 */
width: auto; /* 宽度根据元素内容调整 */
}
/* 所有class为menu的div中的ul中的li样式 */
ul li{float:left; /* 向左漂移,将竖排变为横排 */}
#ulImages li{display:none};
</style>
<script>
function show(id){
var images = document.getElementById("ulImages").getElementsByTagName("li");
for(var i=0;i<images.length;i++){
images[i].style.display = "none";
}
images[id].style.display = "block";
}
</script>
</head>
<body>
<div id="t_c_ggao">
<ul id="ulImages">
<li style="display:block"><img src="images/list-1.jpg" width="480" height="200"/>1</li>
<li><img src="images/list-1.jpg" width="480" height="200" />2</li>
<li><img src="images/lp570.jpg" width="480" height="200"/>3</li>
<li><img src="images/qx570.jpg" width="480" height="200" />4</li>
<li><img src="images/ys570.jpg" width="480" height="200"/>5</li>
<li><img src="images/zx570.jpg" width="480" height="200" />6</li>
<li><img src="images/list-1.jpg" width="480" height="200" />7</li>
</ul>
<ul id="list_number">
<li><a href="#" onclick="show(0)">1</a></li>
<li><a href="#" onclick="show(1)">2</a></li>
<li><a href="#" onclick="show(2)">3</a></li>
<li><a href="#" onclick="show(3)">4</a></li>
<li><a href="#" onclick="show(4)">5</a></li>
<li><a href="#" onclick="show(5)">6</a></li>
<li><a href="#" onclick="show(6)">7</a></li>
</ul>
</div>
</body>
嗯?貌似我回答晚了,仅供参考吧,欢迎交流学习qQgroup21/77/712
热心网友
时间:2022-04-26 02:50
给你一个例子:
<ul>
<li id="1" onclick="dianji(this)">aaaa</li>
<li id="2" onclick="dianji(this)">bbbb</li>
<li id="3" onclick="dianji(this)">cccc</li>
<li id="4" onclick="dianji(this)">dddd</li>
</ul>
//js部分
function dianji(obj){
var =obj.id;
alert("第"++"个li");
}
热心网友
时间:2022-04-26 04:25
js要写的代码比较多,用jquery吧
$('#list_number li').each(function(i){
$(this).click(function(){
$('#t_c_ggao').children('ul:first').children('li:eq('+i+')').show().siblings('li').hide();
});
});
js如何获取被点击li是第几个?
1、首先打开html编辑器,新建一个html文件,里面写入4个li标签,并在上方的style标签中设置li的样式,给li标签高度和宽度以及边框,同时设置li标签之间的间隔。2、然后在script标签中写入js,首先用getElementsByTagName获取所有li标签的dom元素,任何使用for循环遍历数组中的元素,for循环内部设置每个li标签的...
js获取li为选中状态下的内容,li可以选择多个
1 定义一个数组,li绑定点击onclick事件,点击时获取li内容,jq就是.val() ,JS就是innerHTML;2 每点击获取一个就push到数组里;var myCont = [];var lis = document.querySelectorAll('li');for (var i =0; i<lis.length; i++){ lis[i].i = i; lis[i].onclick = functi...
js 事件委托了 之后,怎么知道我点击可第几个li 或许下标
window.onload = function(){ var oUl = document.getElementById("ul"); var aLi = oUl.getElementsByTagName("li"); oUl.onclick = function(ev){ var ev = ev || window.event; var target = ev.target || ev.srcElement; if(target.nodeName.toLowerCase() == "li"...
js怎么获取鼠标悬浮在某一个li时,该li的下标?
整体思路:可以用for循环去遍历<ul>下的所有<li>;然后对比鼠标悬浮时对应的li元素,输出当前的i,也就是对应li的下标。
js怎样获取点击的是第几个li
/* 宽度根据元素内容调整 */}/* 所有class为menu的div中的ul中的li样式 */ul li{float:left; /* 向左漂移,将竖排变为横排 */}#ulImages li{display:none};</style><script>function show(id){var images = document.getElementById("ulImages").getElementsByTagName("li");for(var i=...
javascript 怎么获取 li里面点击的元素索引呢?
ul_lis[i].onclick=function(){ var j=this.index+1; alert(j); } }};</script>如果想简单的放用Jquery很方便就可以获取。<ul id="test"><ul><li>111</li><li>222</li><li>333</li><li>444</li></ul></ul><script>$("#test li").click(function(){var inde...
js如何获取点击<li>标签里的值
思路:为li对象添加单击事件→事件触发后利用innerHTML获取li的文本。实例演示如下:1、HTML结构 <ul id="test"><li>Glen</li><li>Tane</li><li>John</li><li>Ralph</li></ul>2、javascript代码 window.onload = function(){var obj_lis = document.getElementById("test").getElementsBy...
js获取当前点击的<li>的值
var newLi = document.createElement("li");newLi.className = "li1";newLi.id = "li" + (i*num + j);flag = 0;for(k = 0 ; k < num ; k++){ if(bombs[k] == (i*num + j)){ flag = true;break;} } if(flag){ var newtext = document.createTextNode(-1);}else{...
js/jquery怎么样获取本身节点位于兄弟中的第几个???
// 取得当前节点的父节点的所有直接子节点,查看当前节点在所有子节点中的位置,index从0开始。var index = $(this).index($(this).parent().children());
JS控制li下UL显示与隐藏, LI有同级多个,单独控制?
在生成的时候添加独特变量来区别,或者使用$(selector).eq(index)来数第几个。或者使用$(selector).each(function(i,dom){})来过滤选择特定的 一般树型结构都有特定的数据格式,如 parent : {name,list ,children : []},查看对应节点的children的length大小 来判断是否有第二级菜单。