首页 > 解决方案 > Javascript 或 jQuery 在点击事件的表中第 999 行之后未加载 iFrame

问题描述

在单击事件上使用 javascript 或 jquery 加载 iframe 时,我遇到了奇怪的问题。

我有显示结果集的搜索表单,每行都有一个唯一的 id,每行都有相应的 iframe,默认情况下是 display:none。

当用户单击加号图标时,它会加载 iframe 源并将显示 none 删除到相应的 iframe 行。我的代码在第 999 行之前工作正常,但是之后当用户单击加号图标时,它会将源添加到 iframe,甚至将加号(+)图标更改为减号(-),但它仍然没有加载 iFrame 并且没有显示特定行。并且控制台中也没有显示错误。我不知道为什么它在第 999 行之后不起作用。请帮我..

<tr>
    <td class="resultListItem">
      <a style="cursor:hand; text-decoration: none;" class="plus-anchor" href="#row-1045" data-src="http://localhost/l58/public/cic/tab/company-info?mode=iframe&amp;active=tab1&amp;addressid=251856&amp;siteuseid=276003&amp;siteusecode=BILL_TO&amp;customerid=11728&amp;orgid=83" onclick="toggleTabsLoad(1045);">
            <div onclick="changeSymbol('symbol1045')" id="symbol1045" class="plus-icon">+</div>
        </a>
    </td>

    <td class="resultListItem">CONNECT SINGLE SALE</td>
    <td class="resultListItem">123123</td>
    <td class="resultListItem">1110</td>
    <td class="resultListItem">58 DISCOVERY</td>
    <td class="resultListItem">IRVINE</td>
    <td class="resultListItem">US</td>
</tr>
<tr id="TR1045" style="display:none;">
    <td colspan="7">
        <iframe id="row-1045" style="width: 100%;" border-top="1px solid #A9A9A9;" frameborder="0" height="150px"></iframe>
    </td>
</tr>

这是我下面的javascript代码...

function toggleTabsLoad(id) {
        obj = document.getElementById('TR' + id);
        var source = document.querySelector("a[href='#row-" + id + "']").getAttribute('data-src');
        console.log(source);  // giving output in all rows
        frame = document.getElementById('row-' + id);
        console.log(frame);  // giving output in all rows
        frame.src=source;

        if (obj.style.display == 'none') {
            obj.style.display = '';
        } else {
            obj.style.display = 'none';
        }

    }

我也尝试过使用 jQuery,但我得到了相同的行为......

$(function() {
    var plus = $('.plus-anchor');
    plus.on('click', function() {
        var row = $(this).attr('href'),
        source = $(this).data('src');
        $('iframe' + row).attr('src', source);  
    });
});

标签: javascriptjqueryhtmliframe

解决方案


推荐阅读