html随机跳转图片网页

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html随机跳转图片网页相关的知识,希望对你有一定的参考价值。

我有800个图片,地址分别是
www.xxx.com/1.jpg
www.xxx.com/2.jpg
www.xxx.com/3.jpg...

我要的效果就是,访问api.html随机跳转到这些图片网址(例如www.xxx.com/8.jpg)

如果一两张图片的话,那简单

可我800多张,不知道怎么写

拜托各位大佬了!(尽量保证代码量少)

参考技术A <a href="#" onclick="showImg()">api.html</a>

function showImg()
  var n=Math.floor(Math.random()*800+1);
  var urlStr="www.xxx.com/"+n+".jpg";
  self.location=urlStr;

参考技术B js里面有随机函数追问

老哥,求完整html代码

参考技术C js中的Math.random()方法,生成一个0-1之间的随机数,乘以800生成一个800内的随机数,通过parse()方法去除小数,然后把这个数拼接到地址中,点击完成跳转。追问

写不来啊大佬,能直接把代码发出来么,能用会采纳的🙏

3月20号 图片热点 网页划分 表单

图片划分:

规划出图片上的一个区域,可以做出超链接,直接点击图片区域就可以完成跳转的效果。

<img src="../我/m_14_634758583539062500_36767976.jpg" usemap="cat" name="" title="这是一只猫"/>
<map name="cat">
<area shape="circle" coords="111,96,50" href="http://www.baidu.com/"/> 
</map>

网页拼接:

 在一个网络页面内,规划出多个页面窗口,以表格拼接的形式展示出来。

表单:

<form id="" name="" method="post/get" action="负责处理的服务端">

id不可重复,name可重复,get提交有长度限制,并且编码后的内容在地址栏可见,

post提交没有长度限制,且编码后内容不可见。

</form>

1.文本输入

  文本框<input type="txt" name="" id="" value="" />

  密码框<input type="password" name="" id="" value="" />

  文本域<textarea name="" id="" cols=""(字符多少) rows=""(几行高)></textarea>

  隐藏域<input type="hidden" name="" id="" value="" />

2.按钮

  提交按钮<input type="submit" name="" id="" disabled="disabled" value="" />点击后转到form内的提交服务器的地址

  重置按钮<input type="reset" name="" id="" disabled="disabled" value="" />

  普通按钮<input type="button" name="" id="" disabled="disabled" value="" />

  图片按钮<input type="image" name="" id="" disabled="disabled" src="图片地址" />

  disabled使按钮失效

  enable使按钮可用

3.选择输入

  单选按钮组<input type="radio" name="" checked="checked" value="" />

  name的值用来分组,value的值看不见,提交给程序用的,checked设置默认选项。

  复选框组<input type="checkbox" name="" checked="checked" value="" />

  文件上传<input type="file" name="" id="" />

  <lable for=""></lable>

  lable标签为input元素定义标注。

  lable元素不会向用户呈现任何特殊效果,不过,他为鼠标用户改进了可用性。如果您在lable元素内点击文本,就会触发此控件。

  就是说,当用户选择该标签时,浏览器会 将焦点转到和标签相关的表单控件上。

  lable标签的for属性应当与相关元素的id属性相同。

4.下拉列表框

  <select name="" id="" size="" multiple="multiple">

  --size1时,为菜单;>1时,为列表。multiple为多选。

    <option value="">内容1</option>

    <option value="" selected="selected">内容2</option>

    --selected,设为默认

    <option value="">内容3</option>

  </select>

5.标签

         <label></label>

字段集 (一堆label

                  <fieldset></fieldset>

<form>
文本框:<input type="text" value="我爱你"/><br/>
密码框:<input type="password" /><br/>
文本域:<textarea cols="10" rows="5"/>
</textarea><br/>

<input type="submit" value="提交"/><br/>
<input type="reset" value="重置"/><br/>
<input type="button" value="登录"/><br/>
<input type="image" src="../我/cms_13effb0c49d04ec7840e61ec4b497f89.jpg" height="30"/><br/>
<input type="radio" name="sex" />男<br/>
<input type="radio" name="sex"/>女<br/>
<input type="checkbox"/>爆米花<br/>
<input type="checkbox"/>可乐<br/>
<input type="checkbox"/>奶茶<br/>
<select size="1">
<option>奶茶</option>
<option>可乐</option>
<option selected="selected">雪碧</option>
</select>
<select size="3"/>
<option>你</option>
<option>我</option>
<option>他</option>
<option>她</option>
</form>

 

以上是关于html随机跳转图片网页的主要内容,如果未能解决你的问题,请参考以下文章

HTML--2图片热点,网页划区,拼接,表单

HTML · 图片热点,网页划区,拼接,表单

网页中点击下载按钮实现图片下载功能

HTML--2图片热点,网页划区,拼接,表单

2016/2/18 html 图片热点,网页划区,拼接,表单

做了一个网页,怎么随机读取图片?