0

我正在尝试为交易电子邮件构建一个包含一些 javascript 变量和静态文本的 href url 链接。但是，我无法将链接或显示的 URL 显示为完整的构建 URL。

我尝试用单引号和其他一些变体将它们包装起来，但 URL 和显示的 URL 将无法正确显示。任何人都可以帮助解决这个问题吗？

var folder = "orders";
var orderNumber = "589";
var refNum = "Mon";
var job = "image";

HTML

<p style="margin: 0;">If that button will not work, copy and paste the following link in your browser:</p>
<p style="margin: 0;"><a href='"https://example.com/ + folder + "/" + orderNumber + "-" + refNum + "-" + job + ".jpg"' target="_blank">'"https://example.com/" + folder + "/" + orderNumber + "-" + refNum + "-" + job + ".jpg"'</a></p>
4

3 回答 3

3

你有连接问题

href='"https://example.com/ + folder +
                           |___________  Here you should have `"`

您可以简单地使用模板文字

var folder = "orders";
var orderNumber = "589";
var refNum = "Mon";
var job = "image";

let link = `<p style="margin: 0;"><a href='"https://example.com/${folder}/${orderNumber}-${refNum}-${job}.jpg' target="_blank">https://example.com/${folder}/${orderNumber}-${refNum}-${job}.jpg</a></p>`

document.querySelector('#link').innerHTML = link

console.log(link)
<div id='link'></div>

于 2019-04-15T12:21:44.887 回答
2

最好的解决方案是使用模板文字来创建端点，然后使用另一个来创建 HTML。然后你不必担心所有的报价和他们的顺序：

var folder = "orders";
var orderNumber = "589";
var refNum = "Mon";
var job = "image";

const endpoint = `https://example.com/${folder}/${orderNumber}-${refNum}-${job}.jpg`;
const href = `<a href="${endpoint}" target="_blank">${endpoint}</a>`;

document.querySelector('.link').insertAdjacentHTML('beforeend', href);
<p style="margin: 0;">If that button will not work, copy and paste the following link in your browser:</p>
<p class="link" style="margin: 0;"></p>

于 2019-04-15T12:25:30.770 回答
0

你可以试试这个：

<p style="margin: 0;">
   <a id="myLink" href='' target="_blank">""</a>
</p>

 <script type="text/javascript">
     var folder = "orders";
     var orderNumber = "589";
     var refNum = "Mon";
     var job = "image";

     var myLink = document.getElementById("myLink");
     myLink.href = "https://example.com/" + folder 
              + "/" + orderNumber + "-" + refNum + "-" + job + ".jpg";

     myLink.innerHTML = myLink.href;
 <script>

如果你想让它整洁和通用，模板化是要走的路。否则你可以试试这个好的旧 JS 方式。

于 2019-04-15T12:29:40.973 回答