首页新闻找找看学习计划

input file 问题

0
悬赏园豆:40 [已关闭问题]

功能描述;

1、可以上传多个文件,在页面中显示(绝对路径、文件名、上传日期),上传文件的同时将该文件传到服务指定目录下

2、当点击显示的时候,能打开所选中一行或几行的文件(文件的内容显示)

3、当点击删除的时候可以,删除指定的行,每个的id都要改变,序号列也要改变,比如我刚开始的序号列是1\2\3\4\5当删除2\4后得到的是1\2\3

4、当点击添加的时候,能取得所选中行所选中文件的绝对路径和服务路径

问题描述:

1、当点击浏览的时候弹出,选择文件,当点击打开后,将该文件的绝对路径赋值(我取的路径不正确,总是默认的某一个)给第二列,同时将该文件上传到服务路径下

比如选则的是:D:\\ff,但显示的结果是C:\\

2、当我选择某一行或几行后,点击显示,能将该文件打开,比如选中的是1.xls则将该文件打开

3、当点击添加的时候,能取得这个文件的绝对路径和服务器路径,能够上传到服务器。

我实现的js代码如下,用.net开发的。

 

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <script src="http://localhost:5525/Common/js/jquery-1.2.6.pack.js" type="text/javascript"></script>
    <script type="text/javascript">
        function getFile() {
            document.getElementById("fileId").click();
            var fileid = document.getElementById("fileId").value;
            var filename = getFileName(fileid);
            var filepath = getFilePath(fileid);
            addTable_tr(filename, filepath);

        }

        function getFileName(str) {
            //正则表达式
            //var n = /([^\\]+)$/.exec(str);
            // return RegExp.$1;

            var n = str.lastIndexOf("\\");
            if (n < 0) {
                n = str.lastIndexOf("\/");
            }
            if (n >= 0) {
                str = str.substring(n + 1);
            }
            var d = str.lastIndexOf("\.");
            str = str.substring(0, d);
            return str;
        }
        function getFilePath(str) {
            var d = str.lastIndexOf("\\");
            if (d < 0) {
                d = str.lastIndexOf("\/");
            }
            if (d >= 0) {
                str = str.substring(0, d);
            }
            return str;
        }
        //添加行
        var i = 1;
        function addTable_tr(filename, filepath) {
            var show = "";
            show += "<tr id=\"tr" + i + "\" class=\"row\">";
            show += "<td id=\"tdf" + i + "\">" + i + "</td>";
            show += "<input type=\"\">";
            show += "<td id=\"tdp" + i + "\" class=\"tdp\"><input type=\"text\" id=\"txtp" + i + "\" value=\"" + filepath + "\" name=\"filepath\"/></td>";
            show += "<td id=\"tdn" + i + "\" class=\"tdn\"><input type=\"text\" id=\"txtn" + i + "\" value=\"" + filename + "\" name=\"filename\"/></td>";
            show += "<td id=\"tdd" + i + "\" class=\"tdd\"><input type=\"text\" id=\"txtd" + i + "\" value=\"" + getDate() + "\" name=\"date\"/></td>";
            show += "<td id=\"tdk" + i + "\" class=\"tdk\"><input type=\"checkbox\" id=\"" + i + "\" onclick=\"setRowColor(this)\" name=\"ch\"/></td>";
            show += "</tr>";
            $("#tbody").append(show);
            i++;
            setButtonD();
        }
        //删除选中行
        function delete_tr() {
            $("input:checkbox[name=ch]:checked").each(function () {
                $("#tr" + this.id).remove();
                i--;
            })
            //重新更新各项的id
            $('tr').each(function (trIndex, tr) {//更新tr的id
                tr.id = tr.id.replace(/\d+$/, '') + (trIndex + 1).toString();
                $(tr).find('td').each(function (tdIndex, td) {//更新td的id及input的id
                    td.id = td.id.replace(/\d+$/, '') + (trIndex + 1).toString();
                    if (tdIndex > 0) td.firstChild.id = td.firstChild.id.replace(/\d+$/, '') + (trIndex + 1).toString(); //更新input的id
                    else td.innerHTML = trIndex + 1;
                });
            });

            setButtonD();
        }
        //设置被选中行的颜色
        function setRowColor(obj) {
            var chk = document.getElementById(obj.id);
            if (chk.checked) {
                $("#tr" + obj.id).css("background-color", "red");
            } else {
                $("#tr" + obj.id).css("background-color", "");
            }
        }
        //获取系统当前日期
        function getDate() {
            var date = new Date();
            var year = date.getYear();
            var month = date.getMonth() + 1;
            var da = date.getDate();
            if (month < 10) {
                month = "0" + month;
            }
            if (da < 10) {
                da = "0" + da;
            }
            var str = year + "." + month + "." + da;
            return str;
        }

        //设置按钮可用性
        function setButtonD() {
            //获取行tbody下面的class=row的集合(删除后)
            var tr_rowCount = $("#tbody").find(".row");
            if (tr_rowCount.length <= 0) {
                $("#btnS").attr("disabled", true);
                $("#btnD").attr("disabled", true);
            } else {
                $("#btnS").attr("disabled", false);
                $("#btnD").attr("disabled", false);
            }
        }
    </script>
</head>
<body onload="setButtonD();">
    <form id="form1" runat="server">
    <div>
    <input type="hidden" id="hidrow"/>
         <input type="button" id="btnB" value="浏览" onclick="getFile();" />
         <div style="display:none">
         <input type="file" id="fileId"/>
         </div>
         <br />
         <input type="button" id="btnS" value="显示" onclick="" />
         <br />
         <input type="button" id="btnD" value="删除" onclick="delete_tr();" />
         <br />
          <input type="button" id="btnAdd" value="添加" onclick="" />
         <table border="2px solid red">
         <tbody id="tbody">
         </tbody>
         </table>
    </div>
    </form>
</body>
</html>

hw1030的主页 hw1030 | 初学一级 | 园豆:160
提问于:2010-08-05 20:00
< >
分享
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册