我正在尝试实现的目标
以图片为参考,我想按下按钮以将其值(在这种情况下为字母'D')发送到输入占位符内文本的黄色区域。
单击“ D”按钮后的工作示例将在输入字段“在字母'D'内搜索标题或作者...”中显示该示例
问题将是: 使用jquery / js,如何将单击的字母带到搜索输入的占位符上?
我尝试过的事情
我尝试使用jQuery和JavaScript来实现这一目标。但似乎我仍然在这里缺少一些东西。
JS:
onclick = function(){
document.getElementById("#myInput").placeholder = "Search for a title or an author within the letter "+this.dataset.letter;
jQuery:
$(".letters").click(function(){
var inputText = $(".letters").val();
$("#myInput").attr("placeholder", "Search for a title or an author within the letter").val(inputText).focus().blur();
});
我能提供的东西
如果相关的话,我的按钮是通过jQuery这样的数据集创建的。
var letters = ["A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];
for (var i in letters){
$("#letterlinks").append('<button class="table-sort letters" id="#letters" href="%">' + letters[i]);
$(".table-sort.letters").on('click', function(){
$(".table-sort.letters.selected").removeClass('selected');
$(this).addClass('selected');
});
}
html:
<div class="table-search">
<input type="text" id="myInput" onkeyup="searchInput()" placeholder=""><span class="icon"><i class="fa fa-search"></i></span></input>
</div>
如果您需要任何其他信息,我们会尽快为您提供。 谢谢您的宝贵时间!
答案 0 :(得分:2)
使用事件获取单击按钮的对象。
$(".table-sort.letters").on('click', function(event) {
$(".table-sort.letters.selected").removeClass('selected');
$(this).addClass('selected');
$("#myInput").attr("placeholder", "Search for a title or an author within the letter " + event.target.innerText);
});