0

I am working on a tag system: 1.you can select some tags from a list and display them in a tag container (the tag can be selected only once and the sum is limited to 10), and different tag has different colors. 2.you can delete some selected tags in the tag container 3.pass the information to the php and store in the database. 4. display the tags in another page and you can update the selected tag list in this page.

For now the first two steps has finished by javascript but I am quite confused how I can pass the selected information to the php and the database (the content and colors) so they can be displayed and updated in another page.Anyone can give me some suggestions? Thanks.

The link to the jsfiddle is http://jsfiddle.net/V9Euk/1015/

Here is the html:

<ul>
    <li data-val="300"><span class="label label-morning">Morning</span></li>
    <li data-val="301"><span class="label label-afternoon">Afternoon</span></li>
    <li data-val="302"><span class="label label-evening">Evening</span></li>
</ul>

<div class="tagHandler">
    <ul class="tagHandlerContainer" id="tag_handler">
    </ul>
</div>

here is the javascript:

$(function(){
    var tags = [];
    function add_tag(that){
        var tag = $(that).text();
        if($.inArray(tag, tags)>=0|| tags.length >= 10) return;
        tags.push(tag);
        var singleValues = $(that).find('span').clone();
        singleValues[0].innerHTML += "&times";
        $("#tag_handler").append(singleValues);/*display the selected tags in the tag_handler with &times style*/
    }

    $("li").click(function(){
        add_tag(this);
       });/*add tags to the tag_container when click the li*/

    $('#tag_handler').on('click', 'span', function(){
        var tag = $(this).text();
        var index = $.inArray(tag, tags);
        tags.splice(index,1);
        $(this).remove();
    });/*remove the tag when click this tag in the tag_container*/
    });
4

1 回答 1

0

首先,jsfiddle 链接对我不起作用。

现在,唯一的方法是使用 POST/GET 等 http 方法将数据从客户端传递到服务器。实现取决于您最喜欢什么或更好的友好且易于使用的界面,所以我的建议是:

您可以(动态地或不动态地)创建表单(例如带有隐藏字段)并使用 JS 更新它们的值并通过提交按钮传递数据,这是一个简单的实现。

如果您负责用户选择并动态创建数据结构,则另一种实现是使用 Ajax。

在这两种情况下,您都应该使用 php.ini 验证提交数据的正确性。永远不要相信用户或“假定的”JavaScript 限制。

于 2013-08-18T11:16:30.383 回答