0

我正在尝试发明热水：D。我正在使用html5Uploader并且一切正常（正在上传图像而没有任何错误）。问题来得有点晚，在这部分：

onServerLoad: function(e, file) {
    $('.img_upload').on('click', function() {
        $('#text').val($('#text').val() + $(this).attr('title'));
    });
}

值被添加到textarea但它被添加次数，因为有上传的图像（例如，我有 5 个名称为first.png的图像，它将向 textarea 添加 五次 first.png）。我怎样才能避免这种情况？

$(function() {
    var fileTemplate = "<div id=\"{{id}}\">";
    fileTemplate += "<div class=\"preview\"></div>";
    fileTemplate += "<div class=\"filename\">{{filename}}</div>";
    fileTemplate += "</div>";

    function slugify(text) {
        text = text.replace(/[^-a-zA-Z0-9,&\s]+/ig, '');
        text = text.replace(/-/gi, "_");
        text = text.replace(/\s/gi, "-");
        return text;
    }
    $("#dropbox").html5Uploader({
        onClientLoadStart: function(e, file) {
            var upload = $("#upload");
            if (upload.is(":hidden")) {
                upload.show();
            }
            upload.append(fileTemplate.replace(/{{id}}/g, slugify(file.name)).replace(/{{filename}}/g, file.name));
        },
        onClientLoad: function(e, file) {
            $("#" + slugify(file.name)).find(".preview").append("<img class=img_upload title=\"" + file.name + "\" src=\"" + e.target.result + "\" alt=\"\">");
        },
        onServerLoad: function(e, file) {
            $('.img_upload').on('click', function() {
                $('#text').val($('#text').val() + $(this).attr('title'));
            });
        }
    });
});
4

1 回答 1

1

一种方法是检查它是否已经存在，如下所示：

var _val = $('#text').val(), title = $(this).attr('title');
if ( _val.indexOf( title ) === -1 ) {
    // here you add the code
    $('#text').val( _val + title );
}

但我认为问题可能出在您获取名称的方式上，请尝试使用 e.target.result 或 file.name

var _val = $('#text').val(), name = file.name || e.target.result;
if ( _val.indexOf( name ) === -1 ) {
    // here you add the code
    $('#text').val( _val + name );
}

如果您想多次添加同一个，有几种方法可以做到这一点。

通过 for 循环：

// this is if you want to add the duplicates immediately
var
    // the amount of times you want to create the duplicatation
    NUMBER_OF_TIMES = 10,
    // the current value
    _val = $('#text').val(),
    // the title
    title = $(this).attr('title');
if ( _val.indexOf( title ) === -1 ) {
    for ( var i = 0; i < NUMBER_OF_TIMES; i ++ )
        $('#text').val( _val + name );
}

否则，您可以检查出现次数，然后在必要时追加：

// this is if you want to add the duplicates a certain number of times dynamically
var
    // the amount of times you want to create the duplicatation
    NUMBER_OF_TIMES = 10,
    // the current value
    _val = $('#text').val(),
    // the title
    title = $(this).attr('title')
    // Returns the number of occurences
    howMany = function(str, substr) {
        var intRet = 0;

        // continuously run until the substring isn't found anymore
        while ( str.indexOf(substr) !== -1 ) {
            // get rid of first substring
            str = str.replace(substr, '');
            // add one to the amount of substrings
            intRet++;
        }

        // check to see if there are any occurrences, if not, return -1
        return (intRet > 0 ? intRet : -1);
    };
if ( _val.indexOf( title ) === -1 && howMany(_val, title) <= NUMBER_OF_TIMES ) {
    $('#text').val( _val + name );
}

我已尝试使评论尽可能提供信息，但如果您不理解其中的一部分，请在下方评论。试试看，告诉我它是怎么回事！XD

于 2012-11-22T21:53:53.010 回答