首页 > 代码库 > mui上传图片

mui上传图片

2024-09-14 17:09:46   219人阅读

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <script src="js/mui.min.js"></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <style type="text/css">
        
        img{
            width: 100px;
            height: 100px;
            border-radius: 50px;
            display: block;
            margin: 30px auto;
        }
        #btn{
            display: block;
            margin: 30px auto;
        }
    </style>
</head>
<body>
    <header class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title">标题</h1>
    </header>
    <div class="mui-content">
        <img src="img/yt.jpg" id="img1"/>

    <!--<input type="button" id="btn" value="http://www.mamicode.com/change" />-->
    <button id="btn">change</button>
    </div>
    
</body>
<script src="js/castapp.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
          mui.init();
          ca.init();
          
          var oB = ca.id("btn");
          var oi = ca.id("img1");
          ca.click(oB,function(){
              var arr = [‘照相机‘,‘相册‘];
            
castapp.actionSheet(arr,{
    succFn:function(data){
            //手机上的图片路径
//        alert(data);
        //上传后的图片路径
//        alert(‘http://peipao.dongyixueyuan.com/‘+data);
console.log(‘http://peipao.dongyixueyuan.com‘+data);
        oi.src=‘http://peipao.dongyixueyuan.com‘+data;
    },
    errFn:function(data){
        alert(data);
    },
    //是否开启上传
    isUpload:true,
    //上传地址
    uploadUrl:‘http://peipao.dongyixueyuan.com/upload_file.php‘,
    
})
          })
          
    </script>
</html>

 

mui上传图片


联系
我们