0

我正在使用JQuery 标签插件，当用户以逗号分隔输入一些标签时，我想在使用 PHP 提交表单后获取这些标签。

我的编码...

<?php       
if(isset($_REQUEST['submit_tag'])) {
    print_r($_REQUEST['tags']);     
}
?>
<!-- tags -->
<script src="http://webspirited.com/tagit/demo/js/jquery.1.7.2.min.js"></script>
<script src="http://webspirited.com/tagit/demo/js/jquery-ui.1.8.20.min.js"></script>
<script src="http://webspirited.com/tagit/js/tagit.js"></script>
<link rel="stylesheet" type="text/css" href="http://webspirited.com/tagit/demo/css/jquery-ui-base-1.8.20.css">
<link rel="stylesheet" type="text/css" href="http://webspirited.com/tagit/css/tagit-awesome-blue.css">
<script type="text/javascript">
    $(function () {
        $('#demo3').tagit({triggerKeys:['enter', 'comma', 'tab'], select:true});     

        $('#demo3GetTags').click(function () {
            showTags($('#demo3').tagit('tags'))
        });

        function showTags(tags) {
            console.log(tags);
            var string = "Tags (label : value)\r\n";
            string += "--------\r\n";
            for (var i in tags)
                string += tags[i].label + " : " + tags[i].value + "\r\n";
            alert(string);
        }
    });
</script>
<!-- tags -->
<form method="post" id="add_tag" action="" name="add_tag">
    <button id="demo3GetTags" value="Get Tags">Get Tags</button>
    <ul id="demo3" name="tags[]"></ul>
    <br />
    <input type="submit" name="submit_tag" value="Submit Tag" />
</form>
4

2 回答 2

2

您可以在代码中添加以下脚本。

$('input[type=submit]').click(function(){
        tag = $('#demo3').tagit('tags');
        console.log(tag);
        for (var i in tag)
          $('form').append("<input type='hidden' name='tags[]' value='"+tag[i].value+"' >");

      });

所以你的代码将如下所示：

<?php      
    if(isset($_REQUEST['submit_tag'])){
        print_r($_REQUEST['tags']);     
    }
?>
<!DOCTYPE html>
<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>jQuery Tagit Demo Page (PHP/ThemeRoller)</title>
<script src="http://webspirited.com/tagit/demo/js/jquery.1.7.2.min.js"></script>
<script src="http://webspirited.com/tagit/demo/js/jquery-ui.1.8.20.min.js"></script>
<script src="http://webspirited.com/tagit/js/tagit.js"></script>
<link rel="stylesheet" type="text/css" href="http://webspirited.com/tagit/demo/css/jquery-ui-base-1.8.20.css">
<link rel="stylesheet" type="text/css" href="http://webspirited.com/tagit/css/tagit-awesome-blue.css">
<script type="text/javascript">
    $(function () {

      $('#demo3').tagit();    

      $('#demo3GetTags').click(function () {
        showTags($('#demo3').tagit('tags'))
      });
      $('input[type=submit]').click(function(){
        tag = $('#demo3').tagit('tags');
        console.log(tag);
        for (var i in tag)
          $('form').append("<input type='hidden' name='tags[]' value='"+tag[i].value+"' >");

      });
      function showTags(tags) {
        console.log(tags);
        var string = "Tags (label : value)\r\n";
        string += "--------\r\n";
        for (var i in tags)
          string += tags[i].label + " : " + tags[i].value + "\r\n";
        alert(string);
      }
    });
  </script>
<!-- tags -->
<form method="post" id="add_tag" action="" name="add_tag">
  <button id="demo3GetTags" value="Get Tags">Get Tags</button>
  <ul id="demo3" name="tags[]"></ul>
  <br />
  <input type="submit" name="submit_tag" value="Submit Tag"  />

</form>
于 2013-05-04T10:02:41.727 回答
0

使用select:true. 并确保你给你的<ul>

尝试这个

 <ul id="demo3" name="tags[]"></ul> //<-- array to post multiples

 $('#demo3').tagit({triggerKeys:['enter', 'comma', 'tab'],select:true});

这是文档的链接..

于 2013-05-04T08:43:55.403 回答