0

我创建了一个这样的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 运行时，最后在 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。任何帮助都会非常有用。

4

4 回答 4

2

尝试onclick = itemclicked(this.id)代替onclick = 'itemclicked(id)'

于 2012-11-12T09:33:04.370 回答
1

您可以像这样只传递 vari并搜索 id：

你的 p 构造函数是动态的，只传递i

<p  id = "listNum' + i + '" onclick = itemclicked(' + i + ')>

功能

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

是你想要的吗？

于 2012-11-12T09:31:17.900 回答
1

我不确定，但 onclick 函数不应该像这样用双引号括起来：

你有这个

onclick = itemclicked(id)>'

应该是这个

onclick = "itemclicked(id)">'

您必须修改 itemclicked 函数以检索 p 元素的“值”。

function itemclicked( id ) {

    alert( "clicked at :" + id );
    var el = document.getElementById( id );

    // depending on the browser one of these will work
    var pElement = el.contentText || el.innerText; 

    alert( "value of this is: " + pElement );
}

演示在这里

于 2012-11-12T09:55:07.427 回答
1

伙计，你真的应该在你的 CodingStyle 上工作。此外，编写简单、干净的代码。

首先，html 代码应该看起来像这样：

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

没有 div 或类似的东西。ul并且只能ol与 结合使用li。此外，您应该始终以正确的顺序关闭 html-tags。否则，就像在您的示例中一样，您有不同的开始标签和结束标签。（在您的 html-example 的第 5 行的结尾div不是指打开的 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>

您可以在这个fiddle中观看一个工作示例。

问题是：

  1. 您必须使用this.id已经提到的@Varada 提交单击项目的 id。
  2. 在此之前，您必须构建一个有效的 id，使用以下方法将数字解析为字符串.toString()
  3. 你确实写了一些乱七八糟的代码。应该产生的不是一个列表，而是div包装在一个ul-tag 中的各种 -containers。天啊。

顺便说一句：永远不要检查某事是否。正在0使用==- 运算符。最好始终使用===- 运算符。在此处阅读有关问题的信息

BTW++：我不知道value你想在你的itemClicked()-function 中阅读什么。我没有测试它是否会读取innerHTML但通常，您只能从之前写入信息的位置读取信息。在这个示例中，value我猜应该是空的..

希望我没有忘记任何事情。如您所见，该代码现在可以使用。如果您还有其他问题，请尽管提问。

干杯!

于 2012-11-12T13:22:07.497 回答