如何使用Javascript或Ajax在文本字段中实时注入或添加输入字段的值?

怪物码

我有一个ID为#image_tag_list_tokens的text_field,并且该文本字段在图像形式中显示如下:

 = f.text_area :tag_list_tokens, label: "Tags (optional) ->", data: {load: @image_tags }, label: "Tags"

我有一个输入字段和一个按钮,如下所示:

 <input type="text"  name="myNewTag" id="my_new_tag">
 <button name="meNewTagButton" type="button" id="createMy_new_tag">Create new tag</button>

当用户在输入字段中输入新标签时,我想获取该新标签并将其添加到:tag_list_tokens的文本区域内,而无需重新加载页面。tag_list_tokens文本字段的值具有以下格式:

 "old_tag1,old_tag2,'new_tag1','new_tag2'"
拉尔兹

// add event listener for button click
$("#createMy_new_tag").on("click", function(){
  // get the text in the input
  var new_tag = $("#my_new_tag").val(),
  // grab the textarea
      textarea = $("#image_tag_list_tokens")
  // append the input to the current text
  textarea.val(textarea.val() + ", " + new_tag)
  // reset the input
  $("#my_new_tag").val("")
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea id="image_tag_list_tokens">blah</textarea>
<input type="text" name="myNewTag" id="my_new_tag">
 <button name="meNewTagButton" type="button" id="createMy_new_tag">Create new tag</button>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何使用php将多个输入文本字段值添加到db中

来自分类Dev

在javascript的输入数字类型字段中输入值时,如何显示输入文本字段?

来自分类Dev

如何在其他文本字段中输入值时清除文本字段

来自分类Dev

使用javascript从输入文本字段检索json对象值

来自分类Dev

如何在输入文本字段中添加或增加数字值?

来自分类Dev

输入文本字段中的提示值

来自分类Dev

JavaScript数学运算并实时输入文本字段

来自分类Dev

如何删除javascript中的输入文本字段

来自分类Dev

如何使用Javascript填充输入文本字段

来自分类Dev

使用输入文本字段使用Javascript动态更改函数中的值

来自分类Dev

使用输入文本字段使用Javascript动态更改函数中的值

来自分类Dev

如何使用onkeyup / onfocus javascript在文本字段中输入文本?

来自分类Dev

如何使用Javascript根据HTML中的输入文本字段更改文本元素?

来自分类Dev

如何使用javascript将文本输入到文本字段中

来自分类Dev

使用jQuery添加文本字段值

来自分类Dev

如何使用硒在表格中的文本字段组中输入值

来自分类Dev

使用javascript验证文本字段中的输入(需要为两个值之一)

来自分类Dev

快速检查文本字段输入实时

来自分类Dev

如何禁用剩余的输入字段取决于在文本字段中输入的值?

来自分类Dev

如何从JavaScript中的文本字段访问值

来自分类Dev

如何使用p:ajax在PrimeFaces中复制文本字段?

来自分类Dev

使用 javascript 设置文本字段的值

来自分类Dev

跟随用户输入值在文本字段中添加默认文本

来自分类Dev

我如何使用javascript验证html中的文本字段?

来自分类Dev

如何使用javascript更改wordpress联系表单7中文本字段的值

来自分类Dev

如何在添加/删除文本字段中获取所有文本字段的值并形成JSON

来自分类Dev

当用户使用jQuery完成输入或退出文本字段时,如何从文本字段中获取价值?

来自分类Dev

Javascript,如何在同一个输入类型的文本字段中显示两个值?

来自分类Dev

如何在不知道 Javascript 中的 id 的情况下获取输入文本字段的值

Related 相关文章

  1. 1

    如何使用php将多个输入文本字段值添加到db中

  2. 2

    在javascript的输入数字类型字段中输入值时,如何显示输入文本字段?

  3. 3

    如何在其他文本字段中输入值时清除文本字段

  4. 4

    使用javascript从输入文本字段检索json对象值

  5. 5

    如何在输入文本字段中添加或增加数字值?

  6. 6

    输入文本字段中的提示值

  7. 7

    JavaScript数学运算并实时输入文本字段

  8. 8

    如何删除javascript中的输入文本字段

  9. 9

    如何使用Javascript填充输入文本字段

  10. 10

    使用输入文本字段使用Javascript动态更改函数中的值

  11. 11

    使用输入文本字段使用Javascript动态更改函数中的值

  12. 12

    如何使用onkeyup / onfocus javascript在文本字段中输入文本?

  13. 13

    如何使用Javascript根据HTML中的输入文本字段更改文本元素?

  14. 14

    如何使用javascript将文本输入到文本字段中

  15. 15

    使用jQuery添加文本字段值

  16. 16

    如何使用硒在表格中的文本字段组中输入值

  17. 17

    使用javascript验证文本字段中的输入(需要为两个值之一)

  18. 18

    快速检查文本字段输入实时

  19. 19

    如何禁用剩余的输入字段取决于在文本字段中输入的值?

  20. 20

    如何从JavaScript中的文本字段访问值

  21. 21

    如何使用p:ajax在PrimeFaces中复制文本字段?

  22. 22

    使用 javascript 设置文本字段的值

  23. 23

    跟随用户输入值在文本字段中添加默认文本

  24. 24

    我如何使用javascript验证html中的文本字段?

  25. 25

    如何使用javascript更改wordpress联系表单7中文本字段的值

  26. 26

    如何在添加/删除文本字段中获取所有文本字段的值并形成JSON

  27. 27

    当用户使用jQuery完成输入或退出文本字段时,如何从文本字段中获取价值?

  28. 28

    Javascript,如何在同一个输入类型的文本字段中显示两个值?

  29. 29

    如何在不知道 Javascript 中的 id 的情况下获取输入文本字段的值

热门标签

归档