首页 > 解决方案 > 如何使用javascript将值传递给文本字段

问题描述

我正在开发一个网页,该网页接受我应该随后提交到数据库的标签

目前我已经能够使用这个将值传递给文本字段

<select name="one" onchange="if (this.value=='4'){
document.getElementById('cursor').value = 'one,two';

 }
  ;
">
   <option value="" selected="selected">Select...</option>
   <option value="1">1</option>
   <option value="2">3</option>
   <option value="3">3</option>
   <option value="4">4</option>
   <option value="5">5</option>
   <option value="6">6</option>
   <option value="7">7</option>
   <option value="other">Other</option>
   </select>

   <input name="tags" type="text" id="cursor">

现在我尝试向上面的文本字段添加更多功能

使用 tag-it javascript 库

在这个链接:

   http://aehlke.github.io/tag-it/

在我的文本字段中创建标签

   <link href="css/jquery.tagit.css" rel="stylesheet" type="text/css">
   <link href="css/tagit.ui-zendesk.css" rel="stylesheet" type="text/css">
    <script 
src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" 
 type="text/javascript" charset="utf-8"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery- 
   ui.min.js" type="text/javascript" charset="utf-8"></script>

    <!-- The real deal -->
    <script src="js/tag-it.js" type="text/javascript" charset="utf-8"> 
  </script>

   <script>
    $(function(){

        var sampleTags = 
   ['Wordpress','Joomla','Html','CSS','JavaScript/jQuery','JavaScript 
   Frameworks','Responsive Design','Testing/Debugging','Building and 
   Automation Tools/Web Performance','Command Line','Core Python','Web 
    frameworks','Object-relational mappers','Multi-process 
     architecture','Developing and using RESTful APIs','Building Python 
    application','Script writing','Systems administration'];


        //-------------------------------
        // Minimal
        //-------------------------------
        $('#myTags').tagit();

        //-------------------------------
        // Single field
        //-------------------------------
        $('#singleFieldTags').tagit({
            availableTags: sampleTags,
            // This will make Tag-it submit a single form value, as a 
                  comma-delimited field.
            singleField: true,
            singleFieldNode: $('#cursor')
        });

这是当我遇到问题时,文本字段值不再像以前那样更新。

我认为它是因为它的库标签访问了 id。

因为当我从 tag-it 函数中取消标记我的 id 时

例如这里

     comma-delimited field.
            singleField: true,
            singleFieldNode: $('#cursor2')
  // changed my id here to cursor2, now the select menu function is workin 
     again
        });

我如何使这项工作,我需要 tag-it 功能工作,我还需要能够根据选择菜单更新我的文本字段的值

谢谢

标签: javascripthtml

解决方案


推荐阅读