将内部 div 文本传递给函数答案

【问题标题】：Passing Inner div Text to Function将内部 div 文本传递给函数
【发布时间】：2012-03-07 16:25:19
【问题描述】：

我的目标是当用户单击具有特定数据条目的行时，他们将获得有关它的更多信息。到目前为止，我的逻辑是让用户单击该行，并且有一个传递 innerHTML 参数的函数，然后由另一个检索附加信息的函数处理。所以如果有一个类似的列表：

John Doe

Jane Doe

Joe Blow

我认为当用户点击他们的名字时，他们点击的任何内容的 innerHTML 字符串（例如“John Doe”）会以某种方式传递给 getInformation(fullName)，其中 fullName 将是“John Doe”。

这是我的 HTML：

<div class='row' onclick=alert((this).innerHTML)>
    <div class='label'>
         John Doe
     </div>
</div>
<div class='listSeparator'></div>

问题是我不太确定如何实现这一点。上面的 (this).innerHTML 显然不起作用，因为它只会返回"<div id ='labeled' class='label'>John Doe</div>"。有什么办法可以完成我想做的事情吗？还是我什至以正确的角度接近这个？

感谢您提供任何信息！

【问题讨论】：

试试这个alert((this).find("div.label").innerHTML)?
如果你使用 jQuery，那就是小菜一碟。 $('div.label').text() 将获取带有标签类的 div 标签的内容。
你的问题真的和PHP无关，我删除了不相关的信息。

标签： javascript html dom

【解决方案1】：

您想从.label DIV 中读出全名吗？这应该是你想要的（纯 JS，不需要 jQuery）：

<div class='row' onclick="alert((this).children[0].innerHTML)">

http://jsfiddle.net/WuA9R/1/

【讨论】：

这可能是正确的解决方案。我假设用户想要获取信息，无论用户点击行的哪个位置。
你必须同意 Jquery 造就了 JS 之美 ;)
@OfirBaruch 是的，我个人喜欢 jQuery。但是：有时只是不需要 jQuery。仅仅为了阅读 DIVs 内容而加载整个 jQuery 是没有意义的。

【解决方案2】：

您需要的是内部 div 的 innerHTML，而不是外部 div 的 innerHTML。在 DOM 中，内部 div 是外部 div 的子级，因此获取外部 div 的第一个子级并获取该子级的 innerHTML。

类似：

onclick=alert((this).childNodes[0].innerHTML)

【讨论】：

【解决方案3】：

我不确定您要做什么，但我相信您正在寻找以下内容（使用 jQuery）：


<div class="row" onclick="alert( $(this).text() );">test</div>

【讨论】：

【解决方案4】：

<script>
$('.row').Click(function(){
 //var user_name = $(this).find("div.label").text();
 //or even better in case that the username is the only TEXT in the 'row' div:
 var user_name = $(this).text();


 //Do something with the user_name
 //Calling another function for example: getInformation(user_name);
});
</script>

<div class='row'>
    <div class='label'>
         John Doe
     </div>
</div>
<div class='listSeparator'></div>

【讨论】：