zoukankan html css js c++ java

页面从服务器中浏览并添加图片显示

底层页面

<script src="~/Scripts/jquery-1.8.3.min.js"></script>
    <script src="~/EasyUI/jquery.easyui.min.js"></script>
    <link href="~/Theme/NewBlueVacation/Images/uploadify.css" rel="stylesheet" />
    <script src="~/Scripts/jquery.uploadify.min.js"></script>
<script src="~/Scripts/layer/layer.min.js"></script>
    <link href="~/EasyUI/themes/default/easyui.css" rel="stylesheet" />
    <link href="~/EasyUI/themes/icon.css" rel="stylesheet" />
<script>
$(function(){
    $('.travel-info').dialog({
                title: "日程添加/修改",
                closed: false,
                cache: false,
                modal: true,
                 800,
                height: 600,
                href: '/GetData/SetDays?lineID=' + LineID + "&days=" + $('#TravelDays').val(),
            });
});
</script>
<body>
...........
<ul>
                            <li style="text-align:center;700px;"><img src="/Theme/NewBlueVacation/Images/an_baocun_03.png" style="vertical-align:middle;" /><input type="button" class="supplier-save" value="" id="SaveTravelProduct" style="70px;margin-right:20px;color:white;" /><input type="button" class="supplier-save copy" value="" id="SaveTravelProductCopy" style="70px;margin-right:20px;color:white;" />
                            <a class="easyui-linkbutton" data-options="iconCls:'icon-save'" id="btn-add" style="display:none;height:25px;">添加行程</a>
                            <a href="#" id="btn-prview" style="display:none;" target="_blank">预览</a></li>
                        </ul>
………………
<div class="travel-info">

                </div>
</body>

前台页面代码

后台处理代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Newtonsoft.Json;
using Common;
using MODEL;
using System.IO;
using System.Net;
using System.Transactions;
namespace Web.Controllers
{
    public class GetDataController : BaseController
    {
         public ActionResult SetDays(int LineID = 0, int days = 0)
        {
            ViewBag.LineID = LineID;
            ViewBag.days = days;
            return view();
        }
    }
}

GetDataController

SetDays.cshtml处理页面

@using Web;
@{
    Layout = null;
    BLL.IBLL DB = new BLL.IBLL();
    DateTime nowDate = DateTime.Now;
    //if (ViewBag.nowDate != "")
    //{
    //    string NowDate = ViewBag.nowDate;
    //    nowDate = DateTime.Parse(NowDate);
    //}
}
<script src="~/Scripts/layer/layer.min.js"></script>
<script src="~/EasyUI/jquery.easyui.min.js"></script>
<link href="~/Theme/NewBlueVacation/Images/CalendarSmall.css" rel="stylesheet" />
<link href="~/EasyUI/themes/default/easyui.css" rel="stylesheet" />
<link href="~/EasyUI/themes/icon.css" rel="stylesheet" />
<script>
    var selectRow = null;
    var formTotal = 0;
    var LineID = $('#TravelProductId').val();
    $(function () {
        $('#tt').tabs({
            tabPosition: 'left',
            border:false
        });

        $(document).ready(function () {
            $('#tt').tabs({
                tabPosition: 'left',
                border: false
            });
        });

//在弹出窗中弹出一个layer窗口，并浏览服务器的图片，最后把选好的图片添加到这个dialog弹出窗口，
        $(".info-r  input[type='button']").click(function () {
            var parentdiv = $(this).parent().parent().parent();
            var scenery = parentdiv.children("input[name='Scenery']");
            var picList = parentdiv.find('.pic-list');
            $.layer({
                type: 2,
                border: [0],
                title: "选择已上传图片",
                shadeClose: true,
                closeBtn: false,
                scrolling: 'auto',
                maxmin:true,
                btns: 1,
                btn: ['确定'],
                iframe: { src: '/GetData/ShowUploadImgs' },
                area: ['800px', '600px'],
                yes: function (index) {
                    var files = layer.getChildFrame('#filenames', index).val();
                    layer.close(index);
                    if (files != "" || files.length > 0) {
                        files = files.substring(0, files.length - 1);
                        var fil = files.split(',');
                        for (var i = 0; i < fil.length; i++) {
                            //layer.msg('您获得了子窗口标记：' + fil[i], 3, 1);
                            if (scenery.val().indexOf(fil[i]) == -1) {
                                picList.append('<img src="/Upload/TravelProduct/King/' + fil[i] + '"/>');
                                scenery.val(scenery.val() + '|/Upload/TravelProduct/King/' + fil[i]);
                            }
                        }
                    }
                },
                close: function (index) {
                    var files = layer.getChildFrame('#filenames', index).val();
                    if (files != "" || files.length > 0)
                    {
                        files = files.substring(0, files.length - 1);
                        var fil = files.split(',');
                        for (var i = 0; i < fil.length; i++)
                        {
                            if (scenery.val().indexOf(fil[i]) == -1) {
///Upload/TravelProduct/King/这个地址应该做到字符串里面以后可以查询多个文件夹的东西
                                picList.append('<img src="/Upload/TravelProduct/King/' + fil[i] + '"/>');
                                scenery.val(scenery.val() + '|/Upload/TravelProduct/King/' + fil[i]);
                            }
                        }
                    }
                }
            });
            
        });


        //行程图片上传
        $(".info-r  input[type='file']").uploadify({
            formData: {
                folder: '\Upload\TravelProduct\King'  //图片保存的路径，如果没有前面//，图片就会保存到后台处理的一个路径下面去，如有保存路径为D:webUploadTravelProductKing/图片名称；如没有路径为D:/web/ExtemdClass/Upload/TravelProduct/king/图片名称
            },
            swf: '/Theme/NewBlueVacation/images/uploadify.swf',
            uploader: '/ExtendClass/UploadFiles.ashx',
             50,
            height: 20,
            buttonText: '  ',//上传按钮文字
            buttonImage: "/Theme/NewBlueVacation/images/btn.gif",//上传按钮路径
            fileTypeExts: '*.jpg;*.png;*.gif;*.bmp',
            onUploadSuccess: function (file, data, response) {
                var parentdiv = $(this.wrapper).parent().parent().parent();
                var picList = parentdiv.find('.pic-list');
                if (data == "0") {
                    $.messager.alert("提示", "上传失败!", 'error');
                }
                else {
                    $.messager.alert("提示", "上传成功！", 'info');
                    picList.append('<img src="' + data + '"/>');
                    var scenery = parentdiv.children("input[name='Scenery']");
                    scenery.val(scenery.val() + '|' + data);
                }
            }
        });

        //签证的上传功能
        $("#uploadfile").uploadify({
            swf: '/Theme/NewBlueVacation/images/uploadify.swf',
            uploader: '/ExtendClass/UploadFiles.ashx',
             47,
            height: 20,
            buttonText: '    ',//上传按钮文字
            buttonImage: "/Theme/NewBlueVacation/images/btn.gif",//上传按钮路径
            fileTypeExts: '*.jpg;*.png;*.gif;*.bmp;*.doc;*.docx;*.pdf',
            onUploadSuccess: function (file, data, response) {
                if (data == "0") {
                    $.messager.alert("提示", "上传失败!", 'error');
                }
                else {
                    $('#file').append('<a href="' + data + '"  target="_blank">' + file.name + '</a>');
                    $('#filelist').val($('#filelist').val() + ',' + file.name + '|' + data);
                    $.post('/GetData/SaveDocument', { TravelProductId: LineID,VisaDocuments:$('#filelist').val() }, function (data) {
                        $.messager.alert("提示", data.msg, 'info');
                    }, 'json')

                }
            }
        });

        //签证开始
        $('#visaTable').datagrid({
            url: '/GetData/VisaList/' + LineID,
            columns: [[
                           { field: 'VisaId', title: 'VisaId',  100, checkbox: true },
                           { field: 'TravelProductId', title: 'TravelProductId',  100, hidden: true },
                           { field: 'VisaName', title: '签证名称',  200, halign: 'center', editor: { type: 'validatebox' } },
                           { field: 'VisaRequire', title: '签证要求',  450, halign: 'center', editor: { type: 'validatebox' } },
                           //{ field: 'VisaDocuments', title: '签证文档',  100, halign: 'center', editor: { type: 'text' } },
                           {
                               field: 'IsTitle', title: '是否标题',  100, align: 'center', editor: { type: 'validatebox' }, formatter: function (value, row, index) {
                                   if (row.IsTitle) {
                                       return '是';
                                   } else {
                                       return '否';
                                   }
                               }
                           }
            ]],
            toolbar: [{
                text: '新增',
                iconCls: 'icon-add',
                handler: function () {
                    $('#visaTable').datagrid('appendRow', {});
                    selectRow = $('#visaTable').datagrid('getRows').length - 1;
                    $('#visaTable').datagrid('selectRow', selectRow);
                    $('#visaTable').datagrid('beginEdit', selectRow);
                }
            }, '-', {
                text: '编辑',
                iconCls: 'icon-edit',
                handler: function () {
                    var row = $('#visaTable').datagrid('getSelected')
                    if (row != null) {
                        selectRow = $('#visaTable').datagrid('getRowIndex', row);
                        $('#visaTable').datagrid('selectRow', selectRow);
                        $('#visaTable').datagrid('beginEdit', selectRow);
                    }
                    else {
                        $.messager.alert('提示', '请选择你要修改的记录', 'info');
                    }
                }
            }, '-', {
                text: '保存',
                iconCls: 'icon-save',
                handler: function () {
                    $('#visaTable').datagrid('endEdit', selectRow);
                }
            }, '-', {
                text: '删除',
                iconCls: 'icon-remove',
                handler: function () {
                    var delrow = $('#visaTable').datagrid('getSelected');
                    if (delrow == null) {
                        $.messager.alert('提示', '你还没有选择要删除的记录', 'error');
                    }
                    else {
                        $.post('/GetData/Delvisa', { id: delrow.VisaId }, function (data) {
                            $.messager.alert('提示', data.msg, 'info');
                            $('#visaTable').datagrid('load');
                        }, 'json');
                    }
                }
            }, '-', {
                text: '保存为模板',
                iconCls: 'icon-save',
                handler: function () {
                    var rows = $('#visaTable').datagrid('getRows');
                    if (rows == null) {
                        $.messager.alert('提示', '没有数据可保存为模板', '提示');
                    }
                    else {
                        $.messager.prompt('提示信息', '请输入你要保存的模板名：', function (r) {
                            if (r) {
                                var IdList = "";
                                for (var i = 0; i < rows.length; i++) {
                                    var row = rows[i];
                                    if (IdList == "") {
                                        IdList = row.VisaId;
                                    }
                                    else {
                                        IdList = IdList + "," + row.VisaId;
                                    }
                                }
                                $.post('/GetData/SaveVisaTemplage', { idList: IdList, name: r }, function (data) {
                                    $.messager.alert('提示', data.msg, 'info');
                                    $('#t1').combobox('reload');
                                }, 'json');
                            }
                        });
                    }
                }
            }],
            onAfterEdit: function (rowIndex, rowData, changes) {
                rowData.TravelProductId = LineID;
                $.post('/GetData/SaveVisa/', rowData, function (data) {
                    $.messager.show({
                        title: '提示',
                        msg: data.msg,
                        timeout: 5000,
                        showType: 'slide'
                    });
                    $('#visaTable').datagrid('load');
                }, 'json');
                selectRow = null;
            }
        });
        //签证结束


        //保存行程
        $('#saveDays').click(function () {
            formTotal = $('#tt form').size();
            $.post('/GetData/SaveLineItinerary', $('#tt form').first().serialize(), function (data) {
                post(1);
            }, 'json');
        });
        //保存行程结束

        //保存费用说明
        $('#saveFee').click(function () {
            $.post('/GetData/SaveTravelFees/', $('#feeform').serialize(), function (data) {
                
                if (data.sucess) {
                    layer.msg(data.msg, 2, 9);
                }
                else {
                    layer.msg(data.msg, 2, 8);
                }
            },'json');
            //保存费用说明
        });
        //预定须知
        $('#yuDing').click(function () {
            $.post('/GetData/SaveBookings/', $('#knowForm').serialize(), function (data) {
                if (data.sucess) {
                    layer.msg(data.msg, 2, 9);
                }
                else {
                    layer.msg(data.msg, 2, 8);
                }
            },'json');
        });
        //预定须知结束
        $('.calendar-title span').live('click', function () {
            $('#GroupStage').dialog('refresh', '/GetData/GroupStageCalendar?nowDate=' + $(this).attr('data-value') + '&id=' + id);
        });
        $('.head li').each(function () {
            $(this).width($(this).width() + 1);
        });
        $('.calendar ul').live('click', function () {
            var price = $("input[name='AdultPrice']").val();
            var planBit = $("input[name='PlanBit']").val();
            var v = $(this).children('li').first().attr('data-value');
            if ($(this).children('li').size() > 1) {
                $(this).html($(this).children('li').first());
                $('#date-list').val($('#date-list').val().replace("," + v, ''));
            }
            else {
                $('#date-list').val($('#date-list').val() + "," + v);
                $(this).append('<li class="money">￥' + price + '</li><li>' + planBit + '</li>');
            }
        });

        //添加团期
        $('#addtuanqi').click(function () {
            $.post('/GetData/SaveGroupStage', $('#group-form').serialize(), function (data) {

                if (data.sucess) {
                    layer.msg(data.msg, 2, 9);
                }
                else {
                    layer.msg(data.msg, 2, 8);
                }
                //$.messager.alert('提示', data.msg, 'info');
                //if (data.sucess) {
                //    $('#GroupStage').dialog('close');
               // }
            }, 'json')
        });


        

    })
        //行程提交的方法
    function post(i) {
            if (i < formTotal - 1) {
                $.post('/GetData/SaveLineItinerary', $("#tt form").eq(i).serialize(), function (data) {
                    post(i + 1);
                }, 'json');
            }
            else {
                $.post('/GetData/SaveLineItinerary', $("#tt form").eq(i).serialize(), function (data) {
                   // $.messager.alert("提示", data.msg, "info");
                    //$('.travel-info').dialog('close');
                    
                        layer.msg(data.msg, 2, 9);
                   
                }, 'json');
            }
        }


</script>
<div class="easyui-tabs">
    <div title="行程描述">
        
        <div id="tt" class="easyui-tabs">
            @{
                int lineID = ViewBag.LineID;
            }
            @for (int i = 1; i <= ViewBag.days; i++)
            {
                
                MODEL.LineItinerary lModel = DB.I_LineItinerary.GetSingleModelBy(s => s.TravelProductId == lineID && s.WhichDay == i);
                if (lModel == null)
                {
                    <div title="第 @i 天" style="padding:10px;height:460px;">
                        <form>
                            <input type="hidden" name="ItineraryId" />
                            <input type="hidden" name="WhichDay" value="@i" />
                            <input type="hidden" name="Scenery" />
                            <input type="hidden" name="TravelProductId" value="@lineID" />
                            <div class="info-r">
                                <div class="pic-list"></div>
                                <div>
                                    <input type="file" id="uploadbtn@(i)" />
                                    <input type="button" value="服务器添加" id="addimp@(i)" />
                                </div>
                            </div>
                            <ul class="info-l">
                                <li class="clock"><input name="StartEndTravel" /></li>
                                <li class="intro"><textarea name="StrokeDescription"></textarea></li>
                                <li class="cup">早餐：<input name="Breakfast" />中餐：<input name="Lunch" />晚餐：<input name="Supper" /></li>
                                <li class="house"><input name="Stay" /></li>
                            </ul>
                        </form>
                    </div>
                }
                else
                {
                    <div title="第 @i 天" style="padding:10px;height:460px;">
                        <form>
                            <input type="hidden" name="ItineraryId" value="@lModel.ItineraryId" />
                            <input type="hidden" name="WhichDay" value="@lModel.WhichDay" />
                            <input type="hidden" name="Scenery" value="@lModel.Scenery" />
                            <input type="hidden" name="TravelProductId" id="TravelProductId" value="@lModel.TravelProductId" />
                            <div class="info-r">
                                <div class="pic-list">
                                    @{
                    string[] imgArray = lModel.Scenery.Split('|');
                    foreach (var item in imgArray)
                    {
                        if (!string.IsNullOrEmpty(item))
                        {
                            <img src="@item" />
                        }
                    }
                                    }
                                </div>
                                <div>
                                    
                                    <input type="file" id="uploadbtn@(i)"  />
                                    <input type="button" value="从图库中选取" id="addimp@(i)" />
                                </div>
                            </div>
                            <ul class="info-l">
                                <li class="clock"><input name="StartEndTravel" value="@lModel.StartEndTravel" /></li>
                                <li class="intro"><textarea name="StrokeDescription">@Html.Raw(lModel.StrokeDescription)</textarea></li>
                                <li class="cup">早餐：<input name="Breakfast" value="@lModel.Breakfast" />中餐：<input name="Lunch" value="@lModel.Lunch" />晚餐：<input name="Supper" value="@lModel.Supper" /></li>
                                <li class="house"><input name="Stay" value="@lModel.Stay" /></li>
                            </ul>
                        </form>
                    </div>
                }
            }
            @{
                //MODEL.BusinessMan bman = DB.I_BusinessMan.GetLoginInfo();
            }
            <input type="hidden" id="loginname" name="loginname" value="King" />
        </div>
        <div style="text-align:center">
            <img src="~/Theme/NewBlueVacation/Images/2_xin_baocun3.png" style="cursor:pointer" id="saveDays" />
        </div>
    </div>
    <div title="费用说明">
        @{
            string iscontains = "";
            string nocontains = "";
            string isFeeId = "";
            string noFeeId = "";
            var travefees = DB.I_TravelFee.GetListBy(s => s.TravelProductId == lineID);
            if (travefees != null)
            {
                foreach (var travefee in travefees)
                {
                    if (travefee.IsContains.Value == true)
                    {
                        isFeeId += travefee.FeeId + ",";
                        iscontains += travefee.Description+"
";
                    }
                    if (travefee.IsContains.Value == false)
                    {
                        noFeeId += travefee.FeeId + ",";
                        nocontains += travefee.Description + "
";
                    }
                }
            }
            
        }



        <form id="feeform">
            <input type="hidden" value="@lineID" name="TravelProductId"/>
            <div>
                <div>费用包含:</div>
                <div>
                    <input type="hidden" value="@isFeeId" name="isFeeId" />
                    <textarea style=" 760px; height: 230px; resize: none; margin-left: 10px;" name="iscontains" id="iscontains">@iscontains</textarea>
                </div>
            </div>

            <div>
                <div>费用不含:</div>
                <div>
                    <input type="hidden" value="@noFeeId" name="noFeeId" />
                    <textarea style=" 760px; height: 230px; resize: none; margin-left: 10px;" name="nocontains" id="nocontains">@nocontains</textarea>
                </div>
            </div>
            <div style="text-align:center">
                <img src="~/Theme/NewBlueVacation/Images/2_xin_baocun3.png" style="cursor:pointer" id="saveFee" />
            </div>
        </form>

    </div>
    @{
        int TravelProductId = ViewBag.LineID;
        var visa = DB.I_Visa.GetSingleModelBy(s => s.TravelProductId == TravelProductId && s.VisaDocuments != "");
        string doclist = "";
        if (visa != null)
        {
            doclist = visa.VisaDocuments;
        }
    }
    <div title="签证信息">
        <ul class="file-list clearfix">
            <li class="clearfix">
            <span class="floatL">签证材料上传：</span>
            <span style="float:left;margin-top:-5px;">
                <input type="hidden" id="filelist" value="@doclist" />
                <input type="file" id="uploadfile" />
                </span>
            </li>
            <li id="file">
                @{
                    var docArray = doclist.Split(',');
                    foreach (var item in docArray)
                    {
                        if (!string.IsNullOrEmpty(item))
                        {
                            string[] para = item.Split('|');
                            <a href="@para[1]" target="_blank">@para[0]</a>
                        }

                    }

                }
            </li>
        </ul>
        <div id="visaTable"></div>
    </div>
    <div title="预订须知">
        @{
            string know = "";
            string bookingids = "";
            var bookings = DB.I_BookingInformation.GetListBy(s => s.TravelProductId == lineID);
            if (bookings != null)
            {
                foreach (var booking in bookings)
                {
                    bookingids += booking.BookingInforId + ",";
                    know +=booking.Item+"
";
                }
            }
            
        }
        <form id="knowForm">
            <input type="hidden" value="@lineID" name="TravelProductId" />
            <input type="hidden" value="@bookingids" name="bookingid"/>
            <div>
                <textarea style=" 780px; height: 480px; resize: none" id="item" name="item">@know</textarea>
            </div>
        </form>
        <div style="text-align:center">
            <img src="~/Theme/NewBlueVacation/Images/2_xin_baocun3.png" style="cursor:pointer" id="yuDing" />
        </div>
    </div>

    <div title="团期制作">
        <div class="panel-body panel-body-noheader panel-body-noborder">
            <ul class="calendar-title">
                <li class="mr10"><span class="a-l" data-value="@nowDate.AddMonths(-1)"></span>@nowDate.ToString("yyyy年M月")</li>
                <li>@nowDate.AddMonths(1).ToString("yyyy年M月")<span class="a-r" data-value="@nowDate.AddMonths(1)"></span> </li>
            </ul>
            <div class="calendar-week">
                <ul class="mr5">
                    @*<li>星期日</li>*@
                    <li>星期一</li>
                    <li>星期二</li>
                    <li>星期三</li>
                    <li>星期四</li>
                    <li>星期五</li>
                    <li>星期六</li>
                    <li>星期日</li>
                </ul>
                <ul>
                    @*<li>星期日</li>*@
                    <li>星期一</li>
                    <li>星期二</li>
                    <li>星期三</li>
                    <li>星期四</li>
                    <li>星期五</li>
                    <li>星期六</li>
                    <li>星期日</li>
                </ul>
            </div>
            <div class="calendar">
                <div class="mr7">
                    @Html.Raw(ExtendClass.Calendar(nowDate, ViewBag.LineID))
                </div>
                <div>
                    @Html.Raw(ExtendClass.Calendar(nowDate.AddMonths(1), ViewBag.LineID))
                </div>
            </div>
            <form id="group-form">
                <input name="date" type="hidden" id="date-list" />
                <input name="LineId" type="hidden" value="@ViewBag.LineID" />
                <ul class="group-price">
                    <li>成人价：<input name="AdultPrice" class="liw40" value="200" /></li>
                    <li>成人外卖价：<input name="AdultTakeoutPrice" class="liw40" value="300" /></li>
                    <li>儿童价：<input name="ChildrenPrice" class="liw40" value="150" /></li>
                    <li>儿童外卖价：<input name="ChildrenTakeoutPrice" class="liw40" value="150" /></li>
                    <li>计划数：<input name="PlanBit" class="liw40" value="80" /></li>
                    @*<li><input type="button" value="保存" id="btn-save" /></li>*@
                </ul>
            </form>
        </div>
        <div style="text-align:center;float:none;">
            <img src="~/Theme/NewBlueVacation/Images/2_xin_baocun3.png" style="cursor:pointer" id="addtuanqi" />
        </div>
    </div>
</div>

要弹出的页面

对layer弹出窗的后台处理

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Newtonsoft.Json;
using Common;
using MODEL;
using System.IO;
using System.Net;
using System.Transactions;
namespace Web.Controllers
{
    public class GetDataController : BaseController
    {
    public ActionResult ShowUploadImgs()
        {
            //\Upload\TravelProduct\King这个地址可以从前台传过来，以便使用其它目录
            string strPath = "\Upload\TravelProduct\King\";
            string filePath = System.Web.HttpContext.Current.Server.MapPath(strPath);
            string[] dirs = Directory.GetDirectories(filePath);
            string[] Files =Directory.GetFiles(filePath);
            
            string fileNames = null;
            for (int i = 0; i < Files.Length; i++)
            {
                string temp = Files[i].Substring(Files[i].LastIndexOf('\') + 1);
                fileNames +=temp+"|";
            }
            //return fileNames;
            ViewBag.fileNames = fileNames.TrimEnd('|');
            return view();
        }
    }
}

GetDataController

图片浏览并选择所要的图片

@using Web;
@{
    BLL.IBLL DB = new BLL.IBLL();
    DateTime nowDate = DateTime.Now;
    ViewBag.Title = "图片显示";
    ViewBag.KeyWords = "";
    ViewBag.Description = "";
    //if (ViewBag.nowDate != "")
    //{
    //    string NowDate = ViewBag.nowDate;
    //    nowDate = DateTime.Parse(NowDate);
    //}
}
<script src="~/Scripts/jquery-1.8.3.min.js"></script>
<script src="~/EasyUI/jquery.easyui.min.js"></script>
<script src="~/Scripts/layer2/layer.min.js"></script>
<script>
    $(function () {
        var fnames = "";
        $('input[type=checkbox]').click(function () {
            $('#filenames').val("");
            $('input[type=checkbox]').each(function (index) {
                if ($('input[type=checkbox]').eq(index).attr("checked"))
                {
                    $('#filenames').val($('#filenames').val()+$('input[type=checkbox]').eq(index).val() + ",");
                }
            });

        });
    });

</script>
<div id="imgs">
    @{
    string fileNames = ViewBag.fileNames;
    if (!string.IsNullOrEmpty(fileNames))
    {
        string[] files = fileNames.Split('|');
        <dl>
               
                      
                <dt>
                    @{ foreach (var filename in files)
                        {
                            <img src="/Upload/TravelProduct/King/@filename" style="150px;margin-left:20px;">
                            <input type="checkbox" value="@filename" style="margin-left:-20px;"/>
                        }
                    }
                </dt>
        </dl>
    }
    else
    {
            <div>你还没有上传片！</div>
        }
        
    }
    <input type="hidden" id="filenames" />
</div>

ShowUploadImgs.cshtml

查看全文

相关阅读:
配置腾讯云服务器
 django1.11文档模型重点笔记
 pycahrm git配置笔记
 git 命令汇总
 python2, 3环境变量配置(win10下)
git bash 学习2 --更改url 重置密钥 Permission denied (publickey)问题
 我有一个 APP 创意，如何将其实现？
iOS转场动画初探
 瀑布流的简单实现
 Masonry练习

原文地址：https://www.cnblogs.com/bolanbujing/p/4349610.html