如何从特定行获取数据？

Question

我有一个小的3x4表，如这个JSFiddle所示。

单击图像会发出警报，该警报基本上包含单击图像的整个行数据。

但是它在任何浏览器中都不起作用（在Chrome 31.0.1650.63 m，IE 10和Firefox 25.0.1中）。 我的代码如下所示。 “jQuery的1.9.1.js”其实是这个存在于同一文件夹中的PHP文件中。 任何线索为什么它不在JSFiddle外工作？ 此外，如果我使用while($row = oci_fetch_array($result, OCI_ASSOC+OCI_RETURN_LOBS))从Oracle数据库中获取数据，它会工作吗？

<html>
<head>
    <script src="jquery-1.9.1.js">
        $("img.print").click(function (event) {
            //Prevent the hyperlink to perform default behavior
            event.preventDefault();
            var $td = $(this).parent().closest('tr').children('td');
            var string1 = $td.eq(0).text();
            var string2 = $td.eq(1).text();
            var string3 = $td.eq(2).text();
            alert(string1+' '+string2+' '+string3);
        });
    </script>
</head>
<body>

PHP代码

<?php
echo '
<table border="1">
    <tr>
        <td>Data 1</td>
        <td>Data 2</td>
        <td>Data 3</td>
        <td><img src="https://www.gravatar.com/avatar/12e4484b5ae3e5f676efb7c18cbac643?s=24&d=identicon&r=PG" class="print"></img></td>
    </tr>
    <tr>
        <td>Data 4</td>
        <td>Data 5</td>
        <td>Data 6</td>
        <td><img src="https://www.gravatar.com/avatar/12e4484b5ae3e5f676efb7c18cbac643?s=24&d=identicon&r=PG" class="print"></img></td>
    </tr>    
    <tr>    
        <td>Data 7</td>
        <td>Data 8</td>
        <td>Data 9</td>
        <td><img src="https://www.gravatar.com/avatar/12e4484b5ae3e5f676efb7c18cbac643?s=24&d=identicon&r=PG" class="print"></img></td>
    </tr>
</table>
';
?>
</body>
</html>

Answer 1

您的代码不起作用，因为在代码运行时尚未构建DOM。

你应该把你的script标签放在关闭的body标签之前（这是一个好的做法）或者只在DOM准备就绪时运行你的代码：

$(document).ready(function() {

   $("img.print").click(function (event) {
        //Prevent the hyperlink to perform default behavior
        event.preventDefault();
        var $td = $(this).parent().closest('tr').children('td');
        var string1 = $td.eq(0).text();
        var string2 = $td.eq(1).text();
        var string3 = $td.eq(2).text();
        alert(string1+' '+string2+' '+string3);
    });

});

此外，你包括jQuery的方式是错误的。 带有src script标记不应包含内容。 所以你需要两个script标签：

<script src="jquery-1.9.1.js"></script>  
<script>
    $("img.print").click(function (event) {
        //...
    });
</script>

还有一点需要注意：永远不要忘记指定DOCTYPE，这非常重要！

<!DOCTYPE html>
<html>
...

如何从特定行获取数据？

问题描述

1 个解决方案

解决方案1
2 已采纳 2013-12-18 13:07:55

如何从特定行获取数据？

问题描述

1 个解决方案

解决方案1 2 已采纳 2013-12-18 13:07:55

解决方案1
2 已采纳 2013-12-18 13:07:55