已解決430363個問題，去搜搜看，總會有你想問的

用于將文本插入輸入的多個按鈕

首頁猿問用于將文本插入輸入的多個按鈕

用于將文本插入輸入的多個按鈕

JavaScript

哆啦的時光機 2023-07-14 16:28:54

我正在嘗試為我們最常見的搜索提供一個帶有搜索值的按鈕。我想做的是用戶單擊按鈕并插入帶有引號“Some Text”的文本。現在，這就是我使用的單個按鈕。我該如何做到這一點，以便我可以使用一個帶有多個按鈕的腳本？ <button onclick="searchText()" data-product-name="iPhone 12 Pro">iPhone 12 Pro Max</button> <----Current Button<button onclick="searchText()" data-product-name="Pixel 5">Pixel</button> <---- Added for what Id like<button onclick="searchText()" data-product-name="LG">LG</button><---- Added for what Id like<button onclick="searchText()" data-product-name="Samsung S20 Plus">Samsung S20 Plus</button><---- Added for what Id like <script> var i = 0; var txt = '"iPhone 12 Pro Max"'; var speed = 50; function searchText() { if (i < txt.length) { document.getElementById("search-query").value += txt.charAt(i); i++; setTimeout(typeWriter, speed); } } </script>我嘗試添加以下內容但沒有成功。var txt = element.getAttribute('data-product-name');

查看完整描述

2 回答

蕭十郎

TA貢獻1815條經驗獲得超13個贊

var i = 0;

var txt = '"iPhone 12 Pro Max"';

var speed = 50;

var elements = document.querySelectorAll('button')

for (let i = 0; i < elements.length; i++) {

elements[i].addEventListener('click', function() {

var txt = this.getAttribute('data-product-name');

console.log(txt);

});

}

<button data-product-name="iPhone 12 Pro">iPhone 12 Pro Max</button>

<button data-product-name="Pixel 5">Pixel</button>

<button data-product-name="Samsung S20 Plus">Samsung S20 Plus</button>

反對回復 2023-07-14

慕姐8265434

TA貢獻1813條經驗獲得超2個贊

您可以將按鈕的 id 傳遞給 searchText。并使用 jquery 或純 js 讀取文本

<button onclick="searchText('buttonOne')" id= "buttonOne" data-product-name="Samsung S20 Plus">Samsung S20 Plus</button><---- Added for what Id like

// javascript

function(buttonId){

var text = document.getElementById(buttonId).innerHTML

// process the text with your business logic here

}

反對回復 2023-07-14

2 回答
0 關注
176 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

用于將文本插入輸入的多個按鈕

用于將文本插入輸入的多個按鈕

2 回答

添加回答