Question

编辑：以下是表格内容的全部内容

希望这会有所帮助，现在之前为警报工作的代码不再有效。这与它在桌子上有关吗？

我有一个我正在尝试修改的webapp。无论如何，当我点击链接时，我希望它能够调用发送电子邮件的功能。第一项是页面上的文本，第二项是调用用户名的变量。

在.jsp文件中，我正在修改以下行：

<a href="${videoUrl}" target="main" onclick="sendMail(this.parentNode.getElementsByTagName('span')[2].attributes['title'].value, '${model.user.username}')">

上面的代码在使用alert而不是sendMail函数进行测试时有效。您可以在此处查看：http://jsfiddle.net/rr6Wk/72/

我的问题是它没有发送电子邮件，我猜我在上面的代码中有一些不正确的格式或其他内容。

有什么想法吗？

功能：

<script>
function sendMail(video, user) {
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
     } else {// IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
     }
xmlhttp.open("GET", "http://www.yourdomain.com/somedirectory/sendemail.php?video="+video+"&user="+user+'&ip=<%= request.getHeader("X-Real-IP") %>', false);
xmlhttp.send();
}
</script>

这有效，但不可用，因为所有项目都有nicename ID：

<a href="${videoUrl}" target="main" onclick="sendMail(document.getElementById('nicename').title, '${model.user.username}')">

在另一个名为main.jsp的文件中，名称来自，我添加了id =“nicename”但是这不起作用，因为如果我点击第3项它总是显示第一项中的nicename：

<td ${class} style="padding-right:1.25em;white-space:nowrap">
<span id="nicename" title="${child.title}"><str:truncateNicely upper="${cutoff}">${fn:escapeXml(child.title)}</str:truncateNicely></span>
</td>

Answer 1

试试这个

<a href="${videoUrl}" target="main" onclick="sendMail(this.parentNode.getElementsByTagName('span')[2].attributes['title'].value, '${model.user.username}');">

您需要确保getElementsByTagName

至少选择了3个跨度

Answer 2

如果有多个具有相同ID的元素，

getElementById将始终返回第一个元素。因此，它不适用于该目的。为每个 nicename 使用不同的ID，或者使用name（而不是ID）属性与getElementsByName。

对于getElementsByName示例：

<script>
    function doSendMail(videoIndex, userName) {
        //get the list of nicename elements
        var eles = document.getElementsByName('nicename');
        //send the mail. note: error handling is absent
        sendMail(eles[videoIndex].title, userName);
    }
</script>
<!--send mail for the 3rd video-->
<a href="${videoUrl}" target="main" onclick="doSendMail(2, '${model.user.username}')">

第三个选项是使用基于点击元素的相对元素引用，使用this和行走 HTML节点来获取所需元素（标题）。在提供的jsfiddle中，该表有7列。要单击的元素位于第2列（播放链接），所需元素位于第6列（SPAN元素）中。此方法无需name和id属性。

<script>
function doSendMail(playLinkEle, user) {
  var row = playLinkEle.parentNode.parentNode; //get cell, then row
  var cell = row.cells[5]; //get 6th cell (same row)
  var ele = cell.firstElementChild; //get first child element
  sendMail(ele.title, user);
}
</script>
<table>
  <tr>
    <td>
      star image
    </td>
    <td>
      <a onclick="doSendMail(this, '${model.user.username}')" target="main" href="${videoUrl}">play link</a>
    </td>
    <td>
      empty column
    </td>
    <td>
      download link
    </td>
    <td>
      song id
    </td>
    <td>
      unknown detail
    </td>
    <td>
      <span title="The Title">The Title</span>
    </td>
    <td>
      duration detail
    </td>
  </tr>
</table>


      duration detail

Answer 3

感谢您的帮助，最后通过使用2个parentElements让它工作！

<a href="${videoUrl}" target="main" onclick="sendMail(parentElement.parentElement.getElementsByTagName('span')[2].attributes['title'].value, '${model.user.username}');">

OnClick函数的Javascript格式

3 个答案: