Question

编辑：我正在使用Stratus soundcloud API，所以我不希望网址引导我到另一个标签或页面。它应该只是在页面底部有一个弹出窗口，可以播放音乐。对不起，应该早点写这个！

我将此字符串设置为我的变量。在字符串中，我有一个名为PlayButton的按钮的td元素，它链接到一个url。目前它只是一个文本“播放歌曲”，但我想将其改为图像（即使用“assets / play.png”）。

var track = '<tr><td><button class="playButton" data-url="'+url+'"><img src="assets/play.png" alt="Play Song"></button></td><td><button class="playlistButton"> + </button></td></tr>';

我想对playlistButton做同样的事情，所以将它从文本“+”符号更改为加号的图像。

谢谢！

Answer 1

只需使用<a> </a>代码。

这里：

var track = '
    <tr>
        <td>
         <a class="playButton" href="'+url+'"><img src="assets/play.png" alt="Play Song"></a>
        </td>
        <td>
            <a class="playlistButton" href = "url"> + </a>
        </td>
    </tr>';

对于新标签部分，请使用此

要在新标签页中打开：

var track = '
    <tr>
        <td>
         <a class="playButton" href="'+url+'" target="_blank"><img src="assets/play.png" alt="Play Song"></a>
        </td>
        <td>
            <a class="playlistButton" href = "url" target="_blank"> + </a>
        </td>
    </tr>';

要在同一标签中打开，请使用此选项：

var track = '
        <tr>
            <td>
             <a class="playButton" href="'+url+'" target="_self"><img src="assets/play.png" alt="Play Song"></a>
            </td>
            <td>
                <a class="playlistButton" href = "url" target="_self"> + </a>
            </td>
        </tr>';

Answer 2

只需将button更改为a

即可

以下示例。

<tr><td><a class="playButton" href="'+url+'"><img src="assets/play.png" alt="Play Song"></a></td><td><a class="playlistButton" href="#"> + </a></td></tr>

基

var track = '<tr><td><button class="playButton" data-url="'+url+'"><img src="assets/play.png" alt="Play Song"></button></td><td><button class="playlistButton"> + </button></td></tr>';

Answer 3

var track = '
<tr>
    <td>
     <a class="playButton" href="'+url+'" style="background-image:url("assets/play.png");background-repeat:no-repeat;" alt="Play Song"></a>
    </td>
    <td>
        <a class="playlistButton" href = "'+url+'" style="background-image:url("assets/play.png")" > + </a>
    </td>
</tr>';

Answer 4

使用

<a> </a>

标签。它用于超链接，用于从一个页面链接到另一个。请尝试访问此链接（https://www.w3schools.com/tags/tag_a.asp）以获取有关标记的更多信息。

如何将我的td按钮元素从文本更改为链接到网址的图像？

4 个答案: