javascript - 将 Javascript 变量作为 href 传递给 HTML 按钮

标签 javascript html css google-apps-script

我有这个获取用户文件夹 ID 并返回指向该文件夹的链接的 javascript。

    <script>
        function onSuccess(ID_FOLDER) {
        var div = document.getElementById('output');
        var FolderPathURL = "https://drive.google.com/drive/folders/"+ID_FOLDER+"";
        div.innerHTML = "<a href='"+FolderPathURL+"' target='_blank'>Link to Folder</a>"
        }
        google.script.run.withSuccessHandler(onSuccess).getFolderIds();
    </script>

html 看起来像这样,并显示了一个 href 链接。这现在可以正常工作。

<div id="output">Folder URL</div>

但我需要链接是一个按钮(一个 google css 蓝色操作按钮),所以当他们点击按钮时,链接会打开。

<button class="action">Show Folder</button> 

最佳答案

 <script>
    function onSuccess(ID_FOLDER) {
    var div = document.getElementById('output');
    var FolderPathURL = "https://drive.google.com/drive/folders/"+ID_FOLDER+"";
    div.innerHTML = "<a href='"+FolderPathURL+"' target='_blank'><button class="action button-blue">Show Folder</button> </a>"
    }
    google.script.run.withSuccessHandler(onSuccess).getFolderIds();
</script>

按照@Ashwin 的建议添加 css

.button-blue {
 background: -moz-linear-gradient(top, #4d90fe, #4787ed);
 background: -ms-linear-gradient(top, #4d90fe, #4787ed);
 background: -o-linear-gradient(top, #4d90fe, #4787ed);
 background: -webkit-linear-gradient(top, #4d90fe, #4787ed);
 background: linear-gradient(top, #4d90fe, #4787ed);
 border: 1px solid #3079ed;
 color: #fff;
 }

关于javascript - 将 Javascript 变量作为 href 传递给 HTML 按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36238064/

相关文章:

javascript - 无法在 Windows 8 应用程序中获取提要

javascript - 使用 jquery 切换对象的类

html - 为什么 Select 元素之间有一个神秘的边距?

javascript - jquery 表单字段写入问题

javascript - 检查数组是否包含重复值

javascript - Safari 画中画 - 自定义 HTML5 视频 Controller

html - 内联中心三图像

html - 渲染为 pdf 时出现 Visualforce 样式问题

html -::first-letter 伪元素的首字母属性不起作用

javascript - 在 jQuery 中切换类时遇到问题