弹窗上传图片

  <asp:Image ID="smallImg" runat="server" Style="width: 80px; height: 80px;" ImageUrl="~/Admin/images/upload.jpg" />
                                            <br />
                                            <asp:TextBox ID="txtUrlImage" runat="server" Width="25%"></asp:TextBox>
                                            <uc2:UploadImage ID="UploadImage1" runat="server" OriTextBoxControlID="txtUrlImage"
                                                SmallControlID="smallImg" />
                                               

                                                 function goShowDetail() {
            ShowPopWindow('添加相片', 420, 320, 'AddProductImage.aspx?PID=' + goodsid);
        }
       
         <input id="Button1" type="button" class="btn" value="添加照片" οnclick="goShowDetail();" />
        
        
        
        
         function ShowPopWindow(title,w,h,url) {
    if (typeof (WfloatBox) == 'undefined') {
        initbox();
    }
    getElement('FmPop').src = '../public/Loading.html';
    var randomID = Math.random(); 
    url += (url.indexOf('?') > -1 ? '&' : '?') + 'RandomID='+randomID;
       
    WfloatBox.style.width = w;
    WfloatBox.style.height = h;
    getElement('spTitle').innerHTML = title;
    getElement('TBPopContent').style.height = h - 30;
    GetCenterXY_ForLayer(WfloatBox);
   
    getElement('FmPop').height = h - 70;
    getElement('FmPop').src = url;
    showBox();
    return false;
}

转载于:https://www.cnblogs.com/jimmychow/archive/2012/01/12/2320958.html

你可以使用uniapp的官方组件`uni-popup`来实现弹窗,同时使用`uni-form`组件来实现表单。上传图片可以使用`uni.chooseImage`方法来选择图片并上传到服务器,上传数据可以使用`uni.request`方法发送数据到服务器。 以下是一个简单的示例代码: ``` <template> <view> <button @click="showPopup">打开弹窗</button> <uni-popup v-model="show" position="bottom"> <uni-form> <uni-form-item label="标题"> <uni-input v-model="title"></uni-input> </uni-form-item> <uni-form-item label="内容"> <uni-input v-model="content"></uni-input> </uni-form-item> <uni-form-item label="上传图片"> <button @click="chooseImage">选择图片</button> </uni-form-item> <uni-form-item> <button @click="submit">提交</button> </uni-form-item> </uni-form> </uni-popup> </view> </template> <script> export default { data() { return { show: false, title: '', content: '', images: [] } }, methods: { showPopup() { this.show = true }, chooseImage() { uni.chooseImage({ count: 1, success: (res) => { this.images = res.tempFilePaths } }) }, submit() { uni.request({ url: 'your_url', method: 'POST', data: { title: this.title, content: this.content, images: this.images }, success: (res) => { console.log(res) } }) } } } </script> ``` 在这个示例中,`uni-popup`组件作为一个弹窗容器,包含一个`uni-form`表单,表单中包含了标题、内容、上传图片和提交按钮。当点击选择图片按钮时,调用`uni.chooseImage`方法选择图片并将选择的图片路径存储在`images`数组中。当点击提交按钮时,调用`uni.request`方法将表单数据和图片上传到服务器。你需要将`your_url`替换成你的服务器地址。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值