| 热度: |  | | | |  |
看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();
- });
