Как получить данные из определенной строки?

0

У меня есть небольшая таблица 3x4, как показано в этом JSFiddle.

Щелчок по изображению дает предупреждение, в котором в основном есть все данные строки изображения, которое было нажато.

Однако он не работает ни в одном браузере (в Chrome 31.0.1650.63 m, IE 10 и Firefox 25.0.1). Мой код показан ниже. "JQuery-1.9.1.js" на самом деле это присутствует в той же папке, что и файл PHP. Любая подсказка, почему она не работает за пределами JSFiddle? Кроме того, будет ли он работать, если я получаю данные из базы данных Oracle, используя while($row = oci_fetch_array($result, OCI_ASSOC+OCI_RETURN_LOBS))?

<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>
  • 0
    работает в хроме ..
  • 0
    Копирование, вставка точного кода не работает. (в Chrome 31.0.1650.63 м, IE 10 и Firefox 25.0.1)
Показать ещё 1 комментарий
Теги:

1 ответ

2
Лучший ответ

Ваш код не работает, потому что 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, неверно. Тег script с src не должен содержать контент. Поэтому вам нужны два script:

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

Еще одно замечание: никогда не забудьте указать DOCTYPE, это очень важно!

<!DOCTYPE html>
<html>
...
Поделиться
  • 0
    Не повезло. Не работает
  • 0
    @RajarshiSarkar Любые ошибки в консоли Javascript вашего браузера?
Показать ещё 6 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню