【发布时间】：2017-03-19 23:06:32
【问题描述】：
我无法让这个文本输入正确激活随机随机图像数组。它将激活它，但在初始点击时。我希望它要求用户输入然后提交文本进行验证。
<style>iframe {display:none !important;}
<!--
p {color:#000000; font-size:14px; font-family: verdana, serif}
.title {color:#000000; font-size:14px; font-family: verdana, serif}
-->
iframe:first-child { display: none !important; } {
top: 0% !important;
right:0% !important;
display:none !important;
}
</style>
<script language="javascript">
var imagesArray = [
'https://assets.entrepreneur.com/content/3x2/1300/20150827173347-test-google-adwords-campaign-search-engine-internet.jpeg',
'https://yt3.ggpht.com/-DvvzUuiYGos/AAAAAAAAAAI/AAAAAAAAAAA/YoUb-VzIovA/s900-c-k-no-mo-rj-c0xffffff/photo.jpg',
'https://www.google.com/logos/doodles/2015/tu-bav-2015-5651988540817408-hp2x.jpg',
'https://www.google.com/doodle4google/images/splashes/featured.png',
'http://www.onetechstop.net/wp-content/uploads/2016/01/google-logo.jpg',
];
var usedImages = {};
var usedImagesCount = 0;
function displayImage(){
var num = Math.floor(Math.random() * (imagesArray.length));
if ($('#textbox').val() === '') {
e.preventDefault();
}
if (!usedImages[num]){
document.canvas.src = imagesArray[num];
usedImages[num] = true;
usedImagesCount++;
if (usedImagesCount === imagesArray.length){
usedImagesCount = 0;
usedImages = {};
}
} else {
displayImage();
}
}
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".btn1").click(function(){
$("p").fadeOut()
});
});
</script><html>
<head>
<body>
<center>
<form name="imageForm">
<tr align="center">
<td><br><br><br><br><br><br><br><br><br><br>
<img src="http://i.imgur.com/8bp6n2l.jpg" name="canvas" /><br><br>
</td>
</tr>
<tr>
<td>
<center>
<input type="text" class="btn1" id = "textbox" size="60" ><br><br>
<input onclick="displayImage();" type="reset" value="Submit" class="btn1" /><br/>
</td>
</tr>
</table>
</form>
<p><b>Progress</b> or <b>React?</b></p>
</head>
</body>
</html><html>
<head>
<body>
<center>
<form name="imageForm">
<tr align="center">
<td><br><br><br><br><br><br><br><br><br><br>
<img src="http://i.imgur.com/8bp6n2l.jpg" name="canvas" /><br><br>
</td>
</tr>
<tr>
<td>
<center>
<input onclick="displayImage();" type="text" class="btn1" id = "textbox" size="60" ><br><br>
<br/>
</td>
</tr>
</table>
</form>
</head>
</body>
</html>
【问题讨论】：
-
你为什么否定我？我想我让这个尽可能简单/清晰:(
-
可能与否定无关，但我认为如果你能对你的问题做一个 sn-p 会很好。单击第二列
[<>]中的最后一个按钮。另外，你看过confirm吗？ -
@A.Lau 太棒了，我想我可能已经做到了......让我知道我可以如何帮助你帮助我，哈哈！
-
啊忽略确认，没看到你有输入文本，只看到提交按钮。而且我认为您不太了解 sn-ps 的工作原理，所以现在可能只使用 jsfiddle :) 而且我认为只需在
if ($('#textbox').val() === '')中添加return就足够了（如果您只是想检查它是否是否为空。 -
@A.Lau 嗯，
return似乎没有做任何事情，但我在 jsfiddle 中的其余代码也没有......但即使在我的典型编辑器中，它也会呈现什么我已经完成了，不幸的是return没有做任何事情jsfiddle.net/g0su9dpq/1/#&togetherjs=8OUz6DgCHd
标签： javascript arrays image text input