Question

我正在使用TR的rowIndex属性，但它不起作用。如果我在这里做错了，请告诉我。

function myMethod(){
                alert ( this.parent.rowIndex  );   // parentNode is also used
            }

HTML

<table border="1">
            <tr>
                <td onclick="myMethod();">1.1</td>
                <td>1.2</td>
                <td>1.3</td>
            </tr>
            <tr>
                <td onclick="myMethod();">2.1</td>
                <td>2.2</td>
                <td>2.3</td>
            </tr>
            <tr>
                <td onclick="myMethod();">3.1</td>
                <td>3.2</td>
                <td>3.3</td>
            </tr>
            <tr>
                <td onclick="myMethod();">4.1</td>
                <td>4.2</td>
                <td>4.3</td>
            </tr>
        </table>

Answer 1

this.parent.rowIndex中的“this”是窗口。不是td元素。尝试

<td onclick="myMethod(this);">1.1</td>

function myMethod(obj){ alert ( obj.parentNode.rowIndex );}

Answer 2

这样怎么样？

<td onclick="myMethod(this);">1.1</td>

...

function myMethod(obj){
    alert ( obj.parentNode.rowIndex  );   // parentNode is also used
}

Answer 3

其他人已经打败了我为什么你的代码无效（关于this和parentNode属性的值），但我仍然想指出事件附件通过HTML属性已过时且错误。

您应该使用流行的JavaScript库之一，如jQuery，Dojo，YUI，Prototype，ExtJs或Mootools，将事件附加到a中，以确保您的页面结构与事件逻辑分离。这是一个使用jQuery的简单示例：

的JavaScript

$(function() {
    $(".row").click(function() {
        alert( $(this).parent().attr("rowIndex") );
    });
});

HTML

<table>
    <tr>
        <td class="row">1.1</td>
        <td>1.2</td>
        <td>1.3</td>
    </tr>
    <tr>
        <td class="row">2.1</td>
        <td>2.2</td>
        <td>2.3</td>
    </tr>
    <tr>
        <td class="row">3.1</td>
        <td>3.2</td>
        <td>3.3</td>
    </tr>
    <tr>
    <td class="row">4.1</td>
        <td>4.2</td>
        <td>4.3</td>
    </tr>
</table>

Answer 4

    <html>
    <head></head>
    <body>
    <script>
    function myMethod(e){
                            alert('am in');
                            alert(e.parent);
                            alert ( e.innerHTML);   // parentNode is also used
                    }
    </script>


    <table border="1">
                    <tr>
                            <td onclick="myMethod(this);">1.1</td>
                            <td>1.2</td>
                            <td>1.3</td>
                    </tr>
                    <tr>
                            <td onclick="myMethod();">2.1</td>
                            <td>2.2</td>
                            <td>2.3</td>
                    </tr>
                    <tr>
                            <td onclick="myMethod();">3.1</td>
                            <td>3.2</td>
                            <td>3.3</td>
                    </tr>
                    <tr>
                            <td onclick="myMethod();">4.1</td>
                            <td>4.2</td>
                            <td>4.3</td>
                    </tr>
            </table>
            </body>
            </html>

基本上是TD对象的e的值没有作为父项的属性，因此它是未定义的。

我认为您需要通过getElementById搜索tr并向TD提供一些unqiue ID，以便td可以提供其相应的tr id，然后您就可以获得该TR。

http://www.w3schools.com/TAGS/tag_td.asp

Answer 5

试试这种方式

$('#datatable').on("click", ".add18", function () {
    var row = $(this).closest('tr');
    var rowIndex = $(this).closest('tr').index();
    alert(rowIndex);
});

Javascript rowIndex方法无法正常工作

5 个答案: