如何动态提交输入字段的值

时间:2018-05-10 12:47:46

标签: javascript html

我有一些类别:

<div class="cbp-l-inline-title" style=" font-size: 18px;">
    <span style="color: #0669b4">Generic Name:</span> 
    <a><?php echo $category[0]['generic_name'];?></a>
</div>

我希望点击将此<a>的值插入此表单

<form method="post" action="/search/index" class="input-group" style="width: 45%; margin-left: 646px">
    <input type="text" name="search" id="search" class="form-control" minlength=3 placeholder="Generic" aria-label="Recipient's username" aria-describedby="basic-addon2">
    <div id="suggesstion"></div>
    <div class="input-group-btn input-group-append">
        <button class="btn btn-primary btn-outline-secondary" type="submit" name="submit">Search</button>
    </div>
</form>

以便动态开始搜索此字符串的结果。我无法将此值发送到网址,因为它不是拉丁字符

1 个答案:

答案 0 :(得分:3)

HTML

<div class="cbp-l-inline-title" style=" font-size: 18px;">
  <span style="color: #0669b4">Generic Name:</span> 
  <p class="clickMe">click me: text to send after click</p>
</div>

<form method="post"  class="input-group">
  <input type="text" name="search" id="search" class="form-control" minlength=3
                       placeholder="Generic" aria-label="Recipient's username"
                       aria-describedby="basic-addon2">
  <div id="suggesstion"></div>
  <div class="input-group-btn input-group-append">
     <button class="btn btn-primary btn-outline-secondary" type="submit" name="submit">Search</button>
  </div>
</form>

jquery中的javascript

$('.clickMe').on('click', function(){
  var value = $(this).text()
  $('input#search').val(value)
})

https://jsfiddle.net/ora0j4uu/

.submit()如果你想提交它https://www.w3schools.com/jsref/met_form_submit.asp

修改 提交jquery

$('.clickMe').on('click', function(){
  var value = $(this).text()
  console.log(value)
  $('input').val(value)
  $('.input-group').submit()
})