我正在开发一个标签系统:1.您可以从列表中选择一些标签,并将其显示在标签容器中(标签只能选择一次,总和限制为10),不同的标签有不同的颜色。2.您可以删除标记容器中的一些选定标记3.将信息传递给php并存储在数据库中。4.在另一个页面中显示标签,您可以在该页面中更新所选标签列表。
目前,前两个步骤已经用javascript完成,但我很困惑如何将所选信息传递给php和数据库(内容和颜色),以便在另一个页面中显示和更新。有人能给我一些建议吗?谢谢
到jsfiddle的链接是http://jsfiddle.net/V9Euk/1015/
这是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>
这是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 += "×";
$("#tag_handler").append(singleValues);/*display the selected tags in the tag_handler with × 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*/
});
首先jsfiddle链接对我不起作用。
现在,唯一的方法是使用像POST/GET这样的http方法将数据从客户端传递到服务器。实现取决于你最喜欢什么或更好的友好和易于使用的界面,所以我的建议是:
您可以创建(动态或非动态)一个表单(例如,带有隐藏字段),并使用JS更新其值,并通过提交按钮传递数据,这是一个简单的实现。
另一种实现是使用Ajax,前提是要考虑用户选择并动态创建数据结构。
在这两种情况下,都应该使用php验证提交数据的正确性。永远不要相信用户或"假定"的JavaScript限制