Question

不好意思。我只是想了解一些东西。

<span class="button">
            <input type="radio" id="button-2" name="button-group-1">
            <label onclick="changeButton('2');" for="button-2">Text</label>
        </span>

上面的实际可点击链接是什么？

例如，以下网址与在Google.com搜索框中输入“ stackexchange”相同：https://www.google.com/search?q=stackexchange

第一个示例如何实现相同目的？谢谢。

Answer 1

您的代码不会创建可点击的“链接”，而只是创建一个label（单击时会激活其相关单选按钮的选择）。 <label>用于辅助功能，因为它可以更轻松地单击小型显示器上的项目，并且可以被屏幕阅读器朗读。

其中的onclick部分可调用名为changeButton的单独JavaScript函数，并将'2'的字符串传递给它。您尚未提供该功能，因此无法说明其功能，但这是一个独立于label和radio按钮的动作。

// Because of the onclick in the HTML of the label, this function will be invoked
// when you click the label and the data of "2" will be passed to it.
function changeButton(input){
  console.log("You invoked the changeButton function and passed it the value of: " + input);
}

<input type="radio" id="button-2" name="button-group-1">
<label onclick="changeButton('2');" for="button-2">You can click here or on the radio button to activate the radio button, but you can only click on this text to invoke the onclick event associated with the label.</label>

如果要创建实际的链接，只需使用HTML <a>元素（用于超链接）：

<a href="https://www.google.com/search?q=stackexchange">Search for Stack Exchange</a>

将广播输入和标签转换为可点击的网址字符串

1 个答案: