zoukankan      html  css  js  c++  java
  • jq html 页面点击图片直接上传

    <form id="ff" method="post" enctype="multipart/form-data" style="padding-top: 23px;">
      <input style="display: none" name="custId" id="custId"/>
      <font style="margin: 25px 0 0 10px;color: #5c5c5c;">头像</font>
      <img src="${contextPath}/static/images/btn_next.png" style="float: right;padding-right: 15px;height: 20px;"></img>
      <div style="height: 50px;float: right;margin-top: -13px;">
        <div onclick="changeImg()">
          <img src="" style="height:50px;float: left;margin-right:25px;" id="facePath" name="facePath" >
        </div>
        <input id="img_path" style="display: none" name="userLogo" type="file" accept="image/*" />
      </div>
      <div style="display: none;" onclick="addPath()" id="dd">确定</div>
    </form>

    //上传图片
    /* function changeImg(){
      $("#img_path").trigger('click');
    }
    $("#img_path").change(function(){
      var file = this.files[0] ? this.files[0] : null;
      if (!file) { return false; }
      var file_reader = new FileReader();
      file_reader.onload = (function(){
        var image_url = this.result; // 这是图片的路径
        $('#facePath').attr('src', '');
        $('#facePath').attr('src', image_url); // 创建图片标签
      });
      file_reader.readAsDataURL(file);

      $("#dd").trigger('click');

    });
    function addPath(){
      var userLogo = $("#img_path").val();//图片地址
      var custId = $("#custId").val();
      if(userLogo != null && custId != null){
        $.ajax({
          cache: true,
          type: "POST",
          url: "${contextPath}/my/page/changeinfo_userface",
          data: $("#ff").serialize(),
          async: false,
          success: function(data){
            if(data != null){
            var jsonData = eval("("+data+")");
            var message = jsonData.message;
            var status = jsonData.status;
            if(status == "OK"){
              wxAlert(message);
            }else{
              wxAlert(message);
              return;
            }

           }
          }

        });
      }
    } */

  • 相关阅读:
    C++_标准模板库STL概念介绍2-泛型编程
    C++_标准模板库STL概念介绍1-建立感性认知
    C++_新特性1-类型转换运算符
    C++_新特性2-RTTI运行阶段类型识别
    C++_异常9-异常的注意事项
    C++_异常8-异常、类和基础
    C++_异常7-exception类
    C++_异常6-其他异常特性
    redis数据类型之—List
    redis数据类型之—Hash
  • 原文地址:https://www.cnblogs.com/sho560/p/5630265.html
Copyright © 2011-2022 走看看