问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

如何获取innerHTML的id值？

社区维基
1
新手上路，请多包涵

我创建了一个这样的 html：

 <body onload = callAlert();loaded()>
<ul id="thelist">
<div id = "lst"></div>
</ul>
</div>
</body>

callAlert() 在这里：

 function callAlert()
    {
        listRows = prompt("how many list row you want??");
        var listText = "List Number";
                for(var i = 0;i < listRows; i++)
                {
                    if(i%2==0)
                    {
                        listText = listText +i+'<p style="background-color:#EEEEEE" id = "listNum' + i + '" onclick = itemclicked(id)>';
                    }
                    else
                    {
                        listText = listText + i+ '<p  id = "listNum' + i + '" onclick = itemclicked(id)>';
                    }
                    listText = listText + i;

                    //document.getElementById("lst").innerHTML = listText+i+'5';
                }
                document.getElementById("lst").innerHTML = listText+i;
    }

在 callAlert() 内， 我在 <p> 标签内创建了 id runtime，在 for 循环的最后，我设置了这样的段落。 document.getElementById("lst").innerHTML = listText+i;

现在，当单击 listItem 时我很困惑，然后如何访问所选项目的值。

我正在使用这个：

 function itemclicked(id)
    {
        alert("clicked at :"+id);
        var pElement = document.getElementById(id).value;
        alert("value of this is: "+pElement);
    }

但获得价值为 undefined 。任何帮助将不胜感激。

原文由 Narendra Pal 发布，翻译遵循 CC BY-SA 4.0 许可协议

Stack Overflow 翻译javascripthtmldom-events
阅读 851
2 个回答
得票最新
社区维基
1
✓ 已被采纳

伙计，你真的应该在你的 CodingStyle 上努力。另外，编写简单、干净的代码。

首先，html 代码应该如下所示：

     <body onload="callAlert();loaded();">
        <ul id="thelist"></ul>
    </body>

没有 div 或类似的东西。 ul 和 ol li 结合使用。此外，您应该始终以正确的顺序关闭 html 标签。否则，就像在你的考试中一样，你有不同的开始和结束标签。 （结束 div 在你的 html-example 的第 5 行中没有引用开始的 div-tag）…

这是固定代码：

     <script type="text/javascript">
         function callAlert() {
            var rows = prompt('Please type in the number of required rows');
            var listCode = '';
            for (var i = 0; i < rows; i++) {
                var listID = 'list_' + i.toString();
                if (i % 2 === 0) {
                    listCode += '<li style="background-color:#EEEEEE" id="' + listID + '" onclick="itemClicked(this.id);">listItem# ' + i + '</li>';
                }
                else {
                    listCode += '<li id="' + listID + '" onclick="itemClicked(this.id);">listItem# ' + i + '</li>';
                }
            }
            document.getElementById('thelist').innerHTML = listCode;
        }

        function itemClicked(id) {
            var pElement = document.getElementById(id).innerHTML;
            alert("Clicked: " + id + '\nValue: ' + pElement);
        }
    </script>

您可以观看此 小提琴 中的工作示例。

问题是：

  1. 您必须使用 this.id 提交所点击项目的 ID，就像@Varada 已经提到的那样。
  2. 在此之前，您必须构建一个工作 ID，使用 .toString() 将数字解析为字符串
  3. 你确实写了一些乱七八糟的代码。应该产生的结果不是列表，而是各种 div 包装在 ul 标签中的容器。天啊。

顺便说一句：永远不要检查某事。是 0 使用 == 符。最好始终使用 === 符。在 这里 阅读问题

顺便说一句++：我不知道什么 value 你想在你的 itemClicked() 函数中阅读。我没有测试它是否会读取 innerHTML 但通常，您只能从之前写入信息的位置读取信息。在此示例中， value 我猜应该是空的。

希望我没有忘记任何事情。如您所见，代码现在可以正常工作。如果您有任何其他问题，请直接提问。

干杯!

原文由 nozzleman 发布，翻译遵循 CC BY-SA 3.0 许可协议

社区维基
1

尝试 onclick = itemclicked(this.id) 而不是 onclick = 'itemclicked(id)'

原文由 Varada 发布，翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录，登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进，让解决方法与时俱进
推荐问题