Question

我有一个包含链接的表，我正在尝试隐藏列表中包含404个URL的项目我在下表中列出了两个列表。最重要的是它有steve，它有apple.com的链接，然后有账单，它有无效的src，只是指向windows。所以在Windows上它应该自动隐藏在列表中。

以下是我的代码示例：

链接小提琴http://jsfiddle.net/vmhnffss/

HTML

<table>
  <tbody>
    <tr src="https://www.apple.com/" onerror="Error(this);">
      <td class="listname">Steve</td>
      <td class="listdesc">Apple</td>
    </tr>
    <tr src="windows" onerror="Error(this);">
      <td class="listname">Bill</td>
      <td class="listdesc">Windows</td>
    </tr>
  </tbody>
</table>

的JavaScript

function trError(tr) {
    tr.style.display = 'none';
}

Answer 1

您可以使用AJAX和服务器端脚本以这种方式检查URL是否为404：

/* check_url.php
$url = $_POST['url'];
$handle = curl_init($url);
curl_setopt($handle, CURLOPT_RETURNTRANSFER, TRUE);
$response = curl_exec($handle);
$httpCode = curl_getinfo($handle, CURLINFO_HTTP_CODE);
if ($httpCode == 404) {
    echo '404';
    exit();
}
curl_close($handle);
echo 'ok';
exit();
*/

$('tr[src]').each(function (i) {
    var thisRow = $(this);
    var thisSrc = thisRow.attr('src');
    if (thisSrc) {
        $.ajax({
            url: 'check_url.php',
            type: 'post',
            data: {
                'url': thisSrc
            },
            success: function (data, status) {
                if (data != "ok") thisRow.remove();
            }
        });
    };
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table>
    <tbody>
        <tr src="https://www.apple.com/">
            <td class="listname">Steve</td>
            <td class="listdesc">Apple</td>
        </tr>
        <tr src="windows">
            <td class="listname">Bill</td>
            <td class="listdesc">Windows</td>
        </tr>
    </tbody>
</table>

使用onerror检测表中的404链接

1 个答案: