精华内容
下载资源
问答
  • js代码 function findPic1Local(comfirmPic1Local,lookPic) { if(document.getElementById(lookPic).innerHTML=="查看回单") { document.getElementById(comfirmPic1Local).style.display = "block"; document...

    页面代码

     result += "<img id='comfirmPic1Local' style='display:none' >"
     result += "<button id='lookPic'  onclick='findPic1Local("+comfirmPic1Local+","+lookPic+")'>查看回单</button>"
    

    js代码

       function findPic1Local(comfirmPic1Local,lookPic) {
        if(document.getElementById(lookPic).innerHTML=="查看回单") {
            document.getElementById(comfirmPic1Local).style.display = "block";
            document.getElementById(lookPic).innerHTML="隐藏回单";
        }else if(document.getElementById(lookPic).innerHTML=="隐藏回单"){
            document.getElementById(comfirmPic1Local).style.display = "none";
            document.getElementById(lookPic).innerHTML="查看回单";
        }
    }
    
    展开全文
  • js点击按钮显示图片,再点击关闭图片最佳完美解决方案

    js点击按钮显示图片,再点击关闭图片最佳完美解决方案

    参考文章:

    (1)js点击按钮显示图片,再点击关闭图片最佳完美解决方案

    (2)https://www.cnblogs.com/xiaotiancai/p/10763823.html

    (3)https://www.javazxz.com/thread-6437-1-1.html


    备忘一下。


    展开全文
  • js按钮图片显示点击按钮切换图片

    千次阅读 2018-06-22 16:09:46
    点击按钮切换图片 $scope.show_all_shedules = function( $event , row_no){      var t = $scope.current_clicked_btn[row_no];  var picts = $event.srcElement || $event.target;  if (!$scope.current_...
    var var_insert_button_html = '<p style="text-align: center;"> <img id="btn_' + row_no + '" src="ext/icon_image/down1.png" width="25px" height="25px" alt="picture is missing" ng-click="show_all_shedules($event, ' + row_no + ')" ;/></p>';

    图片路径:
    1、index.html 与图片在一个文件夹下时,直接用图片的名字即可   src="311293.jpg"
    2、.html文件与 img图片文件夹位于同一个文件夹下    src="./img/311293.jpg"   或  src="img/311293.jpg"
    3、.html文件所在的文件夹与 img文件夹在同一个文件夹中   src="../img/311293.jpg"
    4、 网络链接图片   src="https://www.iluxiang.top/static/images/logo.png"
    5、 base64图片   src="base64图片地址"

    图片位置居中: 将图片套在一个p或者span标签中,给标签添加一个text-align:center属性。

    alt 图片未正确显示时显示的内容

    点击按钮切换图片
    $scope.show_all_shedules = function( $event , row_no){                  
            var t = $scope.current_clicked_btn[row_no];
            var picts = $event.srcElement || $event.target;
            if (!$scope.current_clicked_btn[row_no]){
                $scope.current_clicked_btn[row_no] = 1;
                picts.setAttribute("src","ext/icon_image/down1.png");             
            }
            else{
                $scope.current_clicked_btn[row_no] = 0;
                picts.setAttribute("src","ext/icon_image/up1.png");             
            }         
        };

     $event 变量可以获取鼠标事件, 还可以监听键盘事件

    html中 document.getElementById 的方法获取的是index.html 的内容,而不是当前js里的
    展开全文
  • 点击按钮显示图片的两种方法

    千次阅读 2016-10-29 16:15:41
    点击按钮显示图片的两种方法
     
    1.function openwin(url) {
    //alert(url);
    var iHeight=550;
    var iWidth=550;
    var iTop = (window.screen.availHeight-30-iHeight)/2; //获得窗口的垂直位置;
    var iLeft = (window.screen.availWidth-10-iWidth)/2; //获得窗口的水平位置;
    OpenWindow=window.open("", "newwin", "height="+iHeight+", width="+iWidth+",top="+iTop+",left="+iLeft+",toolbar=no,menubar=no,scrollbars=no, resizable=yes,location=no, status=no");
    //写成一行
    OpenWindow.document.write("<TITLE>图片</TITLE>")
    OpenWindow.document.write("<BODY BGCOLOR=#ffffff>")
    //OpenWindow.document.write("显示图片")
    OpenWindow.document.write("<img src="+url+" /> ")
    OpenWindow.document.write("</BODY>")
    OpenWindow.document.write("</HTML>")
    OpenWindow.document.close()
    }
    <input type="button" value="查看"
    οnclick="openwin('ftp://${ftpUserName}:${ftpPassword}@${ftpHost}/${idcard}')" class="btn">
    对应的网址:http://www.cnblogs.com/stswordman/archive/2006/06/02/415853.html
    2.图片大小可根据窗口适应
    var oImg=new Image(); //创建图像对象
    oImg.src=url; //设置图像源
    oImg.οnlοad=window.open(url,"","width="+iWidth+",height="+iHeight+",top="+iTop+",left="+iLeft+",toolbar=no,menubar=no,scrollbars=yes, resizable=yes,location=no, status=no,titlebar=no");

    <button onClick="fiximgwin('ftp://huofenghuang:huofenghuang@192.168.9.156/phenix/contract/2016/03/28/1459137070810685.jpg')"> 打开图片</button>
    展开全文
  • 如何使用vue进行按钮点击后指定区域内容隐藏,再次点击按钮隐藏内容显示。实现思路:首选需要设置一个属性为true(show:true),然后使用v-if把show属性绑定到要显示与内容的标签身上,最后给点击按钮添加点击事件,当...
  • ="点击显示图片" id ="bt" /> 9 < img src ="" alt ="" id ="im" /> 10 < script > 11 // 点击显示图片 12 13 // 根据id获取按钮 14 var btObject = document.getElementById( " bt ...
  • 今天来分享一下鼠标点击按钮图片进行切换+图片自动切换+点击左右按钮图片进行切换的三种效果的组合代码。 最后的效果如下:     Html代码部分: <!doctype html> <html lang="en"> <head> <...
  • 前天帮祥哥他女票做个网页作业,大概要求就是使用两个按钮控制图片的切换,在页面右上角出现一个图片按钮点击这个按钮出现下拉菜单。 第一个要求还是很简单的,第二个多花了我几个小时的时间,因为我只做过select...
  • 主要介绍了JS+HTML实现自定义上传图片按钮显示图片功能的方法,结合实例形式分析了JavaScript图片上传、编码转换等相关操作技巧,需要的朋友可以参考下
  • 2.当点击显示的时候,按钮文字变成隐藏,同时图片显示出来,同理,当点击隐藏的时候,按钮文字变成显示,图片隐藏起来 3.当点击换的时候,图片会变成另外一张,当再次点击的时候,图片又会变回来, 4.当图片隐藏的时候,图片不...
  • javascript实现点击按钮切换图片

    千次阅读 2021-01-03 21:32:07
    效果图: 首先搭建基本的结构 ...--默认显示第一张图片--> <img src="img/1.jpg" alt="加载失败" style="width: 800px;height: 400px;"> <button id="pre">上一张</button> <butto
  • 主要介绍了JS简单实现点击按钮或文字显示遮罩层的方法,涉及javascript鼠标事件响应及页面元素属性动态操作相关实现技巧,需要的朋友可以参考下
  • top(div)(显示需要显示图片) bottom UL (li)<选择>left center right 2.实现上述布局 swap.html <!DOCTYPE ...
  • 利用javascript脚本更改web显示图片 文档适用对象 html初学者 感兴趣的小白 前言 推荐一个网址,初级学习HTML的一个网址,在线即可查阅基础理论知识,以及调试代码。而且还有代码示例。www.runoob.com 阅读者需要...
  • js显示一个(按钮图片),点击隐藏旧的替换新的
  • Vue.js 点击按钮显示/隐藏内容 实例

    万次阅读 2017-05-23 10:24:39
    vue点击切换显示隐藏 原本可以成为Google、Facebook的“爸爸”,或者微软的“儿子”,最后却像“孙子”一样被贱卖,沦为互联网浪潮的“弃子”。 new Vue({ el:"#example", data:{ btnText:...
  • 本文实例讲述了javascript实现点击后变换按钮显示文字的方法。分享给大家供大家参考。具体实现方法如下:显示一些按钮,如果点击了,当前点击的按钮文本变为“点了”,其他按钮文本变为“没点”//为所有按钮动态添加...
  • 主要介绍了基于javascript代码实现通过点击图片显示图片的相关资料,需要的朋友可以参考下
  • 点击按钮显示对应的图片

    千次阅读 2016-08-10 12:00:59
    img{display:none;} 请选择 图片1 图片2 图片3 图片4 var arr=["1.png","2.png","3.png","4.png"]; var imgShow=document.getElementById('imgshow');
  • JS实现点击button按钮切换图片

    万次阅读 多人点赞 2018-08-10 12:07:14
    JS实现点击button按钮切换图片 放暑假在家打算学习html/css/js制作网页,只有html/css的一些基础。实现效果如图: 这个网页很简单,是用Dreamweaver写的,但是是通过自己做的,算是对JS的一个入门案列。 最初的...
  • wxml: js: data里 要写图片这个变量。 点击选择图片 预览图片 给 image加事件,利用e.target.dataset.src 获取当前图片地址,赋值给wx.previewImage的current变量。 ...
  • 以下内容适用于同源下载图片: 参考:https://blog.csdn.net/Thea12138/article/details/82801375 <button class="download" onclick=" download('url')"> <i class="layui-icon layui-icon-download-...
  • JS实现默认显示部分文字,点击按钮显示全部        民间机构提前3天预报大理地震 地震局称违法  17日大理州5.0级地震发生之后,在微博上一条曾在3天前就预测大理将发生5.0级地震的微博受到了 很多...
  • js实现这个的原理也简单,在按钮上绑定一个点击事件,将相对应的元素设置隐藏和显示。但是这个网页使用bootstrap做的,就懒得费功夫自己写啦。 第一步我们先写一个标签 &lt;a class="btn btn-black phone...
  • /*将box里的内容居中显示*/ } .btn { display: inline-blocki; /*让a标签变成行内块级元素*/ height: 30px; line-height: 30px; border: 1px solid #ccc; text-decoration: none; color: #333; ...
  • js基础【点击按钮 切换图片

    千次阅读 2019-07-08 18:23:13
    // step表示要显示图片的索引值 var flag = 0; // flag用来标记循环还是顺序, 0表示顺序 , 1表示循环 rightBtn.onclick = function(){ //点击一次右箭头,step+1 step++; if(step === 4){ // if...
  • JS在拍照之后显示图片在页面上,然后点击编辑按钮返回到之前拍照的页面,请问返回拍照页面的JS要怎么写 ?
  • 利用js实现点击按钮切换图片的功能,并且能够记录当前所展示的图片的位置,通过这个练习来巩固一下对DOM中的节点查询和事件绑定的知识。 提示:以下是本篇文章正文内容,下面案例可供参考 一、DOM是什么? DOM全称:...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 81,989
精华内容 32,795
关键字:

js点击按钮显示图片