//表示当前高亮的节点
var highlightindex = -1;
function save(event){
var textvalue = $("#text");
var autoNode = $('#autoNode');
var myEvent = event || window.event;
var keyCode = myEvent.keyCode;
if (keyCode >= 65 && keyCode <= 90 || keyCode == 8 || keyCode == 46) {
jQuery.ajax({
tyep: "post",
url: "servlet/GeooleAction",
data: "name=周明睿",
success: function(msg){
if (!textvalue.val()) {
autoNode.html("");
}
else {
autoNode.html("");
//将msg对象转换为jquery对象
var data = jQuery(msg);
//找到所有的word节点
var word = data.find('word');
word.each(function(){
//取出textValue的坐标
var xy = textvalue.offset();
//取出单词的内容
var datavalue = $(this).text();
//alert(3);
//创建div,将文本的值放进去,
$('<div>').html(datavalue).appendTo(autoNode);
autoNode.css("left", xy.left + 0 + "px").css("color", "red").css("position", "absolute").css("border", "1px black solid").width(textvalue.width() + 4).show();//.css("border-width", "1px");
})
//}//end if keycode
}
//获取span对象
}
});//end ajax
}//end if keycode
else if(keyCode==38||keyCode==40){
if(keyCode==38){
//向上
//获取div对象
var autoChild=autoNode.children();
if(highlightindex!=-1){
autoChild.eq(highlightindex).css("background-color","white");
highlightindex--;
autoChild.eq(highlightindex).css("background-color","red");
}else{
highlightindex=autoChild.length-1;
autoChild.eq(highlightindex).css("background-color","red");
}
}
if(keyCode==40){
//向下
//获取div对象
var autoChild=autoNode.children();
if(highlightindex!=-1){
autoChild.eq(highlightindex).css("background-color","white");
highlightindex++;
if(highlightindex==autoChild.length){
highlightindex=0;
autoChild.eq(highlightindex).css("background-color","red");
}else{
autoChild.eq(highlightindex).css("background-color","red");
}
}else{
highlightindex=0;
autoChild.eq(highlightindex).css("background-color","red");
}
}
}//end else if
else if(keyCode==13){
//获取高亮的内容,填到文本框中,像服务器发送
if (highlightindex != -1) {
//取出高亮节点的文本内容
var comText = $("#autoNode").hide().children("div").eq(highlightindex).text();
highlightindex = -1;
//文本框中的内容变成高亮节点的内容
$("#text").val(comText);
} else {
//下拉框没有高亮内容
alert("文本框中的[" + $("#word").val() + "]被提交了");
}
//发送给服务器
}
}
$(document).ready(function(){
alert(1);
}
)$('#autoNode').bind('click',function(){
alert(1);
$("#autoNode").children().each(function(i){
$(this).click(function(){
var divValue = $(this).text();
textvalue.val(divValue);
})
})
})不管是绑定click事件,还是直接$('#autoNode').click()都没反应,还想请问绑定事件和直接$('#autoNode').click()这样定义一个click事件,有什么区别。 在这里还遇到了一个问题,就是在ie9版本以下,我定义的层显示在文本框中。火狐是在文本框的下一行
<body>
This is my JSP page. <br>
用户名 <input type="text" value="" id="text" onkeyup="save(event)">
<div id='autoNode'></div>
</body>jqueryajaxdivclick对象
var highlightindex = -1;
function save(event){
var textvalue = $("#text");
var autoNode = $('#autoNode');
var myEvent = event || window.event;
var keyCode = myEvent.keyCode;
if (keyCode >= 65 && keyCode <= 90 || keyCode == 8 || keyCode == 46) {
jQuery.ajax({
tyep: "post",
url: "servlet/GeooleAction",
data: "name=周明睿",
success: function(msg){
if (!textvalue.val()) {
autoNode.html("");
}
else {
autoNode.html("");
//将msg对象转换为jquery对象
var data = jQuery(msg);
//找到所有的word节点
var word = data.find('word');
word.each(function(){
//取出textValue的坐标
var xy = textvalue.offset();
//取出单词的内容
var datavalue = $(this).text();
//alert(3);
//创建div,将文本的值放进去,
$('<div>').html(datavalue).appendTo(autoNode);
autoNode.css("left", xy.left + 0 + "px").css("color", "red").css("position", "absolute").css("border", "1px black solid").width(textvalue.width() + 4).show();//.css("border-width", "1px");
})
//}//end if keycode
}
//获取span对象
}
});//end ajax
}//end if keycode
else if(keyCode==38||keyCode==40){
if(keyCode==38){
//向上
//获取div对象
var autoChild=autoNode.children();
if(highlightindex!=-1){
autoChild.eq(highlightindex).css("background-color","white");
highlightindex--;
autoChild.eq(highlightindex).css("background-color","red");
}else{
highlightindex=autoChild.length-1;
autoChild.eq(highlightindex).css("background-color","red");
}
}
if(keyCode==40){
//向下
//获取div对象
var autoChild=autoNode.children();
if(highlightindex!=-1){
autoChild.eq(highlightindex).css("background-color","white");
highlightindex++;
if(highlightindex==autoChild.length){
highlightindex=0;
autoChild.eq(highlightindex).css("background-color","red");
}else{
autoChild.eq(highlightindex).css("background-color","red");
}
}else{
highlightindex=0;
autoChild.eq(highlightindex).css("background-color","red");
}
}
}//end else if
else if(keyCode==13){
//获取高亮的内容,填到文本框中,像服务器发送
if (highlightindex != -1) {
//取出高亮节点的文本内容
var comText = $("#autoNode").hide().children("div").eq(highlightindex).text();
highlightindex = -1;
//文本框中的内容变成高亮节点的内容
$("#text").val(comText);
} else {
//下拉框没有高亮内容
alert("文本框中的[" + $("#word").val() + "]被提交了");
}
//发送给服务器
}
}
$(document).ready(function(){
alert(1);
}
)$('#autoNode').bind('click',function(){
alert(1);
$("#autoNode").children().each(function(i){
$(this).click(function(){
var divValue = $(this).text();
textvalue.val(divValue);
})
})
})不管是绑定click事件,还是直接$('#autoNode').click()都没反应,还想请问绑定事件和直接$('#autoNode').click()这样定义一个click事件,有什么区别。 在这里还遇到了一个问题,就是在ie9版本以下,我定义的层显示在文本框中。火狐是在文本框的下一行
<body>
This is my JSP page. <br>
用户名 <input type="text" value="" id="text" onkeyup="save(event)">
<div id='autoNode'></div>
</body>jqueryajaxdivclick对象
解决方案 »
- (超级求助)js this这个如何 在其他地方模拟这个this
- 求助select的onchange和文本框那些事儿
- 如何给方法传递对象【在动态添加时间的过程中】
- ■■在用户输入单科成绩时,总分栏能自动求各显示
- 請教一下...
- 如何修改样式 ul li img
- 想用js将几个元素放到列表里,怎么有几个不听话啊
- 请问,使用attachEvent 与将函数直接赋给事件的区别是什么??
- 如何使得单击超链接能谈出confirm框呢?
- 如何去除IE的菜单条,工具条,地址条和状态条,并且屏蔽热键“F5”和右键菜单,谢谢
- 一个页面,用户如果没有成功登录,则不允许访问,自动跳转到login.asp
- 输入“用户ID“,自动跳出“用户姓名”
save(e);
});