从按钮读取文本并输入并运行答案

【问题标题】：Reading text from button and put into input and run从按钮读取文本并输入并运行
【发布时间】：2016-04-04 13:15:39
【问题描述】：

我正在为按钮和 JavaScript 苦苦挣扎。

我有一个按钮，例如名称为button1，我想输入它的名称button1，然后单击输入。我的意思是我想发送查询以进行搜索/排序。

这是我到目前为止所做的。它正在工作，但只是将文本放入输入框中，没有任何操作。

$( "button" ).click(function() {
  var text = $( this ).text();
  $( "input" ).val( text );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<button>button1</button>
<button>button2</button>
<button>button3</button>
<button>button4</button>
<input type="text" placeholder="Search">

【问题讨论】：

文本进入文本域后，你到底想做什么？
请提供更多关于你想要做什么的细节。
我想从按钮中获取文本，可能是 value="name1" 并将其粘贴到输入搜索中并执行它以继续对项目进行排序
你想把它寄到哪里？你想做一个 AJAX 请求吗？您需要向我们提供您想要做的事情。
是的，它是 ajax 请求

标签： javascript button input

【解决方案1】：

所以当你点击你想要的按钮时：

要填充按钮名称的输入
提交表单？

在这种情况下，将（至少）input 包装在 form 标记内。在您的 JS 中填写输入后提交form。

http://jsfiddle.net/9t7L4dmw/3/

【讨论】：

【解决方案2】：

$("form").on('click', 'button', function () {
  $("#search").val($(this).text());
}).on('submit', function (event) {
  event.preventDefault;
  var data = $(this).serialize();
  alert(data);
  // $.post(...);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<form method=post>
  <button type=submit>button1</button>
  <button type=submit>button2</button>
  <button type=submit>button3</button>
  <button type=submit>button4</button>
  <input type=search id=search name=search placeholder="Search">
</form>

关于没有ajax的版本

在sn-p这里不起作用：

阻止向“http://stacksnippets.net/js”提交表单，因为该表单的框架已被沙盒化且未设置“允许表单”权限。

但在 jsfiddle 中可以：http://jsfiddle.net/9t7L4dmw/4/

【讨论】：

hmm 它可能有效，但我不想重新加载页面。我有一个简单的输入字段，我只需要在那里输入文本并继续它
@JarosławŁabuzek，然后发送一个 ajax 请求。看没问题。
我会尝试实现你的代码。希望它会工作
有不加{form}标签的选项吗？
@JarosławŁabuzek，是的，有。但是没有理由使用它。