![](/img/trans.png)
[英]How to change an <input> field's VALUE attribute in real time with JavaScript?
[英]How do I a use Javascript or ajax to inject or add a the value of an input field in a textfield in real time?
我有一個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>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.