首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

什么地方错了,该怎么处理

2013-09-12 
什么地方错了style typetext/cssdl dt { width:100px float:left }dl dd { margin-left:200px }/

什么地方错了

<style type='text/css'>
dl dt { width:100px; float:left; }
dl dd { margin-left:200px; }
</style>
 
<script type='text/javascript'>
var clone;
$(function() {
  $('dl dd').click(function() {
    $(this).html("<input type='text' /> <select><option value='Work'>Work</option></select> <span class='close'>x</span>");
    clone = $(this).clone(true);
  });
  $('.class').live('click', function() {
    $(this).parent().html('Add a phone number');
  });
  $('dl dd input').keydown(function() {
    $('this').parent().append("<br /><span class='another'>Add another</span>");
  });
  $('.another').live('click', function() {
    $(this).parent().parent().append(clone);
  });
});
</script>
 
<dl>
  <dt>Phone</dt>
  <dd>Add a phone number</dd>
</dl>

[解决办法]
引用:
Quote: 引用:

jquery是哪个版本?
1.7以上,live方法就被on替代了。

.class是哪个~~
单击input不取消冒泡,dd的单击事件也是会一直触发的~~
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type='text/css'>
dl dt { width:100px; float:left; }
dl dd { margin-left:200px; }
</style>
<script type='text/javascript' src='http:////ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'></script>  
<script type='text/javascript'>


var clone;
$(function() {
  $('dl dd').click(function() {
    $(this).html("<input type='text' /> <select><option value='Work'>Work</option></select> <span class='close'>x</span>");
    clone = $(this).clone(true);
  });
  $('.class').live('click', function() {
    $(this).parent().html('Add a phone number');
  });
  $('dl dd input').keydown(function() {
    $('this').parent().append("<br /><span class='another'>Add another</span>");
  });
  $('.another').live('click', function() {
    $(this).parent().parent().append(clone);
  });
});
</script>
</head>

<body>
<dl>
  <dt>Phone</dt>
  <dd>Add a phone number</dd>
</dl>
</body>
</html>

版本是最新的,就是运行了,点击了文字,出现文本框,点击文本框不能输入文字


首先,用live方法肯定是会报错的,控制台显示如下:
什么地方错了,该怎么处理

其次,你点击dd出现文本框后,你再点击文本框,这时dd的事件又被触发(又一次重新在dd内填充字符串“<input type='text'/><select>....”)。你每点一次文本框,dd就重新填充一次,所以就影响了文本的正常输入。

热点排行