JQuery вставка HTML не работает - PullRequest
Новая
       11

JQuery вставка HTML не работает

1 голос
/ 09 января 2010

У меня есть таблица, в которую я хочу вставить html в тд в следующей строке. Я вставил один ряд ниже. 

<tr class="content">
    <td align="center">
      <a class="version" href="theurl">click here to update the td in the row below</a>
    </td>
    <td align="left">col 2</td>
    <td align="left">col 3</td>
    <td align="left">col 4</td>
    <td align="left">col 5</td>
    <td align="left">col 6</td>
</tr>
<tr class="version" style="display: none;">
    <td colspan="6"></td>  <-- this is where i want to insert the new html in.
</tr>

мой скрипт jquery выглядит следующим образом. 

$("a.version").click(function () {
    var sLink = $(this).attr("href"); <-- this gets the link to retrieve data from
    var nexttr = $(this).parent().parent().next(".version"); <-- gets the next tr
    var nexttrtd = $(this).parent().parent().next(".version td:first"); <-- gets the first td in the next tr. alerting the colspan displays 6 (which is correct)

    nexttrtd.html("hello world"); <-- this wont insert the text in the td.
    nexttr.css("display", "");

    return false;
});

Теперь вопрос, почему html не отображается в td? Я попытался добавить, innerHTML = "bla", и это тоже не сработает.

Думаю, я делаю все по инструкции, но не могу понять, в чем дело.

есть идеи?

Ответы [ 5 ]

2 голосов
/ 09 января 2010

html не вставляет строку sData В, но НА ВМЕСТО.

Используйте .append (), а не .html ()!

2 голосов
/ 09 января 2010

Возможно, что next() завершится неудачно, так как пытается найти элемент td:first, который находится рядом с текущим tr. Попробуйте вместо этого: 

$("a.version").click(function () {
    var sLink = $(this).attr("href"); <-- this gets the link to retrieve data from

    var nexttrtd = $(this).closest('tr').next('.version').find('td:first');
    nexttrtd.html("hello world"); // This will insert "hello world" to the td

    return false;
});

Я сократил некоторый избыточный код, который, похоже, ничего не делал. Странно то, что вы выбрали nexttr, но затем снова начали поиск nexttrtd с самого начала. Вы могли бы просто использовать элемент nexttr в помощь: 

var nexttr = $(this).closest('tr').next(".version"); // gets the next tr
var nexttrtd = nexttr.find('td:first'); // Gets the first td in that row
0 голосов
/ 09 января 2010

одна часть сейчас работает. Ключ, чтобы получить тд в следующем tr был следующим:

var nexttrtd = $ (this) .parent (). Parent (). Next ("tr.version, td"); $ .get (sLink, function (sData) { nexttrtd.html ( "" + SDATA + ""); nexttr.css ("display", ""); });

(запятая в "tr.version, td"). Теперь дело в том, что html не вставляет строку sData в, но в STEAD OF.

Вот почему я обошел это, вставив "тоже, но, конечно, это не так, как должно быть или что?

Есть ли правильный способ сделать это?

(добавление sData будет, но sData рядом с так, что также не требуется.

0 голосов
/ 09 января 2010

Убедитесь, что ваш скрипт jQuery выполняется на странице. Если это не так, событие click никогда не будет добавлено для вашего тега.

0 голосов
/ 09 января 2010

Я попробовал твой код, и он работает для меня. Правильно ли включен jQuery в заголовок вашей страницы, без каких-либо опечаток? Я проверил это с 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
...