Question

我对JQuery和Dropzone插件有疑问。

我有这样的HTML代码：

<form action="/file-upload" class="dropzone">
  <div class="fallback">
    <input name="file" type="file" multiple />
  </div>
</form>

在dropzone.js中，我想设置addRemoveLinks: true，并希望设置链接删除文件的样式。

在dropzone.js中代码就是这样。

Dropzone.prototype.defaultOptions = {
dictRemoveFile: "Remove file",
    if (this.options.addRemoveLinks) {
            file._removeLink = Dropzone.createElement("<a class=\"dz-remove btn btn-default\" href=\"javascript:undefined;\" data-dz-remove>" + this.options.dictRemoveFile + "</a>");
            file.previewElement.appendChild(file._removeLink);
    }

当我检查元素时的结果是：

<a class="dz-remove btn btn-default" href="javascript:undefined;" data-dz-remove="">Remove file</a>

我只想在标记div class="custom"

之外制作a

示例：

Dropzone.prototype.defaultOptions = {
    dictRemoveFile: "Remove file",
        if (this.options.addRemoveLinks) {
                file._removeLink = Dropzone.createElement("<div class=\"custom\"><a class=\"dz-remove btn btn-default\" href=\"javascript:undefined;\" data-dz-remove>" + this.options.dictRemoveFile + "</a><div>");
                file.previewElement.appendChild(file._removeLink);
              }

但我不知道为什么。当我尝试在网络浏览器中运行它时，链接不可点击。所以当我尝试检查元素时它只有这个：

<div class="custom">Remove file</div>

请注意标记a已消失。

我尝试按照这样的结果制作

<div class="custom">
<a class="dz-remove btn btn-default" href="javascript:undefined;" data-dz-remove="">Remove file</a>
</div>

但它无法正常工作。

Answer 1

我不熟悉dropzone，但根据你已经拥有的代码，这可能有用：

Dropzone.prototype.defaultOptions = {
    dictRemoveFile: "Remove file",
        if (this.options.addRemoveLinks) {
            file._removeLink = Dropzone.createElement("<a class=\"dz-remove btn btn-default\" href=\"javascript:undefined;\" data-dz-remove>" + this.options.dictRemoveFile + "</a>");
            var custom = Dropzone.createElement("<div class=\"custom\"></div>");
            custom.appendChild(file._removeLink);
            file.previewElement.appendChild(custom);
        }

Answer 2

为了避免混淆并使代码更具可读性，而不是使用双引号作为html属性的值，请使用单引号，如下所示：

Dropzone.createElement("<a class='dz-remove btn btn-default' href='javascript:undefined;' data-dz-remove=''>Remove file</a>")

通过这种方式，您可以摆脱反斜杠，从中可以看出您的代码有什么问题。

如何使用jquery

2 个答案: