Question

我创建了一些生成一些程序代码的HTML / JavaScript网站。创建程序代码时，它会显示在textarea元素中。用户可以点击按钮，代码将被复制到剪贴板。

在常规HTML / JavaScript中，这很好用。但现在我将它移植到SharePoint 2013中的Webpart Snippet。

当用户点击按钮时，代码将成功存储为用户剪贴板中的文本。但在同一时刻，SharePoint网站会重新加载并重置代码段中的所有设置。我无法理解为什么JavaScript代码在SharePoint中的代码段中运行时表现得如此不同。这是代码：

    ...

    copy2clip = function() {
        document.getElementById('TextCASL').select();
        try {
            var successful = document.execCommand('copy');
            var msg = successful ? 'successful' : 'unsuccessful';
            console.log('Copying text command was ' + msg);
        } catch (err) {
            console.log('Oops, unable to copy');
        }
    }

    ...

</script>
<button onclick=jacascript:copy2clip();>Copy to clipboard</button>

Answer 1

点击处理程序末尾只需return false以阻止页面提交：

copy2clip = function() {
    document.getElementById('TextCASL').select();
    try {
        var successful = document.execCommand('copy');
        var msg = successful ? 'successful' : 'unsuccessful';
        console.log('Copying text command was ' + msg);
    } catch (err) {
        console.log('Oops, unable to copy');
    }

    return false;
}

行为并非特定于SharePoint，但在您的情况下可能会发生这种情况，因为<form>元素内的按钮。因此，点击它会导致表单提交给服务器。

或者，在按钮的标记上设置type="button"也应该没问题：

<button type="button" onclick=jacascript:copy2clip();>Copy to clipboard</button>

Answer 2

当我在自定义django管理页面中添加复制功能时，页面会重新加载。

即使我在onclick函数中什么也没写，页面也会重新加载。

原因不是功能。

当我将button元素更改为input元素时，它会起作用。

<input type="button" onclick="myCopy('{obj.id}')" value="Copy"/>

Answer 3

当您使用“按钮”标记时，默认情况下它将提交表单，而不管函数中有什么内容。因此，它将导致刷新当前浏览器窗口。但是，如果您使用“ input type = button”，则默认情况下它将不提交表单，它将检查功能动作。

为什么Sharepoint在复制到clipbpard时会意外重新加载页面？

3 个答案: