我知道它非常复杂,但我要做的就是建立一个标签系统。我使用“@”首字母从ajax调用获取数据库中的数据。我能够做所有事情,即使标签正在创建,但我无法获取这些标签并在表格标签下的数据库中提交它们。
<script type="text/javascript" src="http://ajax.googleapis.com/
ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
var start=/@/ig; // @ Match
var word=/@(\w+)/ig; //@abc Match
$("#text").live("keyup",function()
{
var content=$(this).text(); //Content Box Data
var go= content.match(start); //Content Matching @
var name= content.match(word); //Content Matching @abc
var dataString = 'searchword='+ name;
//If @ available
if(go.length>0)
{
$("#msgbox").slideDown('show');
$("#display").slideUp('show');
$("#msgbox").html("Type the name of someone or something...");
//if @abc avalable
if(name.length>0)
{
$.ajax({
type: "POST",
url: "boxsearch.php", // Database name search
data: dataString,
cache: false,
success: function(data)
{
$("#msgbox").hide();
$("#display").html(data).show();
}
});
}
}
return false();
});
//Adding result name to content box.
$(".addname").live("click",function()
{
var username=$(this).attr('title');
var old=$("#contentbox").html();
var content=old.replace(word," "); //replacing @abc to (" ") space
$("#contentbox").html(content);
var E="<a class=red contenteditable='false' href='#' >"+username+"</a>";
$("#contentbox").append(E);
$("#display").hide();
$("#msgbox").hide();
});
});
</script>
// Inserting data to database using ajax
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.js"></script>
<script type="text/javascript" >
$(function() {
$(".submit").click(function()
{
var contentbox = $("#contentbox").val();
var dataString = 'contentbox='+ contentbox;
if(contentbox.length < 1)
{
alert('It seems you havnot entered anything.');
}
else
{
$.ajax({
type: "POST",
url: "insert-tag.php",
clearForm: true,
data: dataString,
success: function(html){
$("ol#update-status").append(html);
$("ol#update-status li:last").fadeIn("slow");
$("#flash").hide();
document.getElementById("text").value = "";
}
});
}return false;
}); });
</script>
//HTML Code
<div id="container">
<div id="text" contenteditable="true"></div>
<div id='display'>
</div>
<div id="msgbox">
</div>
<br>
<br>
<div id="contentbox" >
</div>
<input type="submit" class="submit">
</div>