JavaScript代码不起作用

-5

我想通过将文本转换为文本字段来编辑文本。我只是想尝试在我的浏览器，所以我复制并粘贴在Dreamweaver中，但它不工作：JavaScript代码不起作用

，但它不工作

的代码如下

<label id="edit" style="cursor:pointer; color:blue;"> 
    edit 
</label> 
<table> 
    <tr> 
     <td>First Name:</td> 
     <td>John</td> 
    </tr> 
    <tr> 
     <td>Last Name:</td> 
     <td>Wright</td> 
    </tr> 
</table> 
<script type="text/javascript" charset="utf-8"> 
$('#edit').click(function() { 
    var $table = $('table'); 
    if ($table.find('input').length) return; 
    $table.find('td:nth-child(2)').html(function (i, v) { 
     return '<input value=' + v + '>'; 
    }) 
}) 
$('table').on('blur', 'input', function() { 
    $('table input').replaceWith(function() { 
     return this.value; 
    }) 
}) 
</script>

任何帮助，请

来源

2013-04-21 Mercury121

即使我有麻烦语法..如果你使用Firefox，你可以使用一个名为“萤火虫”，当他们出现错误，会告诉你的JavaScript错误的工具安慰。 – Silvertiger 2013-04-21 09:35:15

你把jquery添加到你的页面了吗？ – 2013-04-21 09:37:24

请提一下你面对的错误 – 2013-04-21 09:47:48

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

编辑

<table> 
<tr><td>First Name: </td> 
    <td>John</td> 
</tr> 
<tr><td>Last Name: </td> 
    <td>Wright</td> 
</tr>

$('#edit').click(function() { 
    var $table = $('table'); 
    if ($table.find('input').length) return; 
    $table.find('td:nth-child(2)').html(function(i, v) { 
    return '<input value=' + v + '>'; 
    }) 

    }) 


$('table').on('blur', 'input', function() { 
$('table input').replaceWith(function() { 
    return this.value; 
}) 
})

来源

2013-04-21 09:47:50

代码是好的，对我来说它工作。 – 2013-04-21 09:49:05

应该注意那些双向正斜杠。 – Oleg 2013-04-21 09:54:25

它仍然不起作用:( – Mercury121 2013-04-21 09:57:30

不要忘记的jQuery的DOM加载添加到页面中，以能够使用其选择以及$(document).ready()尽快加载脚本和网页内容之前被加载。

<!DOCTYPE html> 
<html> 
    <head> 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
     $('#edit').click(function() { 
      var $table = $('table'); 
      if ($table.find('input').length) return; 
      $table.find('td:nth-child(2)').html(function(i, v) { 
      return '<input value=' + v + '>'; 
      }) 
     }) 
     $('table').on('blur', 'input', function() { 
      $('table input').replaceWith(function() { 
      return this.value; 
      }) 
     }) 
     }); 
    </script> 
    </head> 
    <body> 
    <label id="edit" style="cursor:pointer; color:blue;">edit</label> 
    <table> 
     <tr><td>First Name: </td> 
      <td>John</td> 
     </tr> 
     <tr><td>Last Name: </td> 
      <td>Wright</td> 
     </tr> 
    </table> 
    </body> 
</html>

来源

2013-04-21 09:54:38

哇哇哇谢谢..其工作 – Mercury121 2013-04-21 10:00:59

没问题！需要让你的基础知识正确别忘了标记我的答案，如果它让你成为一个快乐的人！ – 2013-04-21 10:06:47

添加jQuery库

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

来源

2013-04-21 10:10:18

JavaScript代码不起作用

回答

相关问题