Discuz!多附件上传选择框之jQuery版
本文最后更新于 6022 天前,其中的信息可能已经有所发展或是发生改变。

看Discuz!附件上传时候的选择框做的很不错
就拿jQuery练手顺手写了一个
jQuery多附件上传的演示效果就如Discuz!的上传选择框是一样的,不同的只是代码,现在拿出来给大家分享一下。:)

代码如下:

var aid = 1;
var attachexts = new Array();
var attachwh = new Array();

function addAttach() {
    newnode = $("#attachbodyhidden > tr").clone();
    var id = aid;
    var tags;
    tags = newnode.find("input");
    for(i in tags) {
        if(tags[i].name == 'attach[]') {
            tags[i].id = 'attach_' + id;
            tags[i].onchange = function() {insertAttach(id)};
            tags[i].unselectable = 'on';
        }
        if(tags[i].name == 'localid[]') {
            tags[i].value = id;
        }
    }
    tags = newnode.find("span");
    for(i in tags) {
        if(tags[i].id == 'localfile[]') {
            tags[i].id = 'localfile_' + id;
        }
    }
    aid++;
    $("#attachbody").append(newnode);
}

function insertAttach(id) {
    var localimgpreview = '';
    var path = $("#attach_" + id).attr("value");
    var ext = path.lastIndexOf('.') == -1 ? '' : path.substr(path.lastIndexOf('.') + 1, path.length).toLowerCase();
    var re = new RegExp("(^|\\s|,)" + ext + "($|\\s|,)", "ig");
    var localfile = $("#attach_" + id).attr("value").substr($("#attach_" + id).attr("value").replace(/\\/g, '/').lastIndexOf('/') + 1);
    attachexts[id] = in_array(ext, ['gif', 'jpg', 'png', 'bmp']) ? 2 : 1;

    $("#localfile_" + id).html('<a href="###delAttach" onclick="delAttach(' + id + ')">[' + lang['post_attachment_deletelink'] + ']</a> <a href="###insertAttach" title="' + lang['post_attachment_insert'] + '" onclick="insertAttachtext(' + id + ', ' + attachexts[id] + ');return false;">[' + lang['post_attachment_insertlink'] + ']</a> <span id="localimgpreview_' + id + '" > </span><span class="smalltxt">[' +id + ']</span> ' + localfile + '');
    $("#attach_" + id).css("display",'none');//style.display = 'none';
    addAttach();
}

function delAttach(id) {
    $("#attach_" + id).parent().parent().remove();
    $("#attachbody").html() == '' && addAttach();
}

$(document).ready(function() {
    addAttach();
});

评论

  1. BruceOuyang
    11年前
    2013-6-21 17:12:40

    大哥能把页面元素也写写不,方法写的挺好,可是咋用呀,

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇