HTML Comprobar con AJAX si existe una imagen

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了HTML Comprobar con AJAX si existe una imagen相关的知识,希望对你有一定的参考价值。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Using AJAX to check if a file exists</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>
<script type="text/javascript">
var req, image, warning, imagepath;

function d(o)
{
	return document.getElementById(o);
}

function loadimage(_imagepath)
{
	image = d("image");
	image.style.display = "none";

	imagepath = _imagepath;

	warning = d("warning");
	warning.innerHTML = "Loading ...";

	req = getreq();
	req.onreadystatechange = imagexists;
	req.open("get", imagepath, true);
	req.send(null);		
}

function imagexists()
{
	if(req.readyState == 4)
	{
		if(req.status == 200)
		{
			warning.innerHTML = "Image exists";
			image.style.display = "block";
			image.src = imagepath;
		}
		else
		{
			warning.innerHTML = "Image does not exist";
			image.style.display = "none";
		}
	}
}

function getreq()
{
	if(window.XMLHttpRequest)
		return new XMLHttpRequest();
	else if(window.ActiveXObject)
		return new ActiveXObject("Microsoft.XMLHTTP");
}

</script>
<style type="text/css">
* { font-family: Verdana, Arial, sans-serif; }
body { background-color: #FFF; }
h1 { font-size: 14px; }
#warning { margin: 10px; }
#img { border: 1px solid #CCC; padding: 3px; margin: 10px; }
</style>
</head>

<body>

	<h1>Check an image exists with AJAX</h1>

	<input type="button" value="Load real image" onclick="loadimage('IMAG0272.jpg');" />
	<input type="button" value="Load fake image" onclick="loadimage('5hhhh_thumb.jpg');" />

	<div id="warning"></div>
	<img id="image" src="blank.jpg" style="display: none;" alt="" />

</body>
</html>

HTML 作为 AJAX 调用的结果(PROs 和 CONs)

【中文标题】HTML 作为 AJAX 调用的结果(PROs 和 CONs)【英文标题】:HTML as a result for an AJAX call (PROs an CONs) 【发布时间】:2011-08-31 19:02:50 【问题描述】:

对于作为 AJAX 调用的结果返回 HTML 代码,您有何看法(赞成和反对)。也就是说,如果应用程序在列表中创建了一个新项目并且它需要一些额外的参数或一些模式自定义,而不是通过 JS 修改它,我们可以通过 AJAX 调用将其模板化发送。

关键是 HTML sn-ps 从服务器发送到客户端计算机并集成在文档 DOM 中。这种方法有什么问题吗?

【问题讨论】:

有趣的问题,很高兴看到一些关于通过 AJAX 发送原始文本并在客户端上用 JS 进行所有格式/标记生成更快的分析,或者只是发送整个 XML通过网络阻塞并简单地将其添加到 DOM。无论哪种方式,我怀疑有很大的不同。 【参考方案1】:

完全没有问题,完全正常且合理的事情。

有时有一个用例是发送数据而不是标记并使用客户端模板对其进行扩展,但这主要适用于您发送 大量 数据并因此想要保持电线上的尺寸。 (例如,一个大表,其 HTML 表示形式为 100k,但 JSON 格式的原始数据仅为 10k。)或者当模板根据客户端条件而变化时。但总的来说,发送 HTML 并通过 innerHTML (或任何几个库的包装器中的任何一个来帮助您解决奇怪的问题)将 HTML 合并到 DOM 中是非常好的。

【讨论】:

【参考方案2】:

这是一种常见的方法。

如果您要向列表中添加项目或用完全不同的内容替换 pod 的内容,这很好。

这也使得将 AJAX 应用到现有网站(例如覆盖或其他东西)变得更加容易,因为您可以向现有页面发出请求,然后删除您不需要的部分。

但是,对于只有一个值发生变化的更新,最好使用 Json。

【讨论】:

【参考方案3】:

就个人而言,我几乎总是选择接收未应用标记或格式的 JSON 响应,但这只是因为我喜欢非常灵活、精细的响应,因此我可以对返回的数据做任何我想做的事情,而不必将其从 HTML 中剥离出来。在很多情况下,这不一定是最简单或最优雅的解决方案! :)

【讨论】:

以上是关于HTML Comprobar con AJAX si existe una imagen的主要内容,如果未能解决你的问题,请参考以下文章

sql Comprobar sihayalgúnregistroen base de datos con los mismos valores。

HTML 作为 AJAX 调用的结果(PROs 和 CONs)

text 检查电子邮件correcto comprobar

java comprobar复选框列表框

csharp comprobar饼干

JavaScript Comprobar fecha 2