Javascript：用jquery编辑预览图

我有2个div，第一个有标签，内容要显示，但是当你点击“编辑”按钮时，它应该会显示div =“edit”和内容链接到它的输入内的第一个标签（相同的id）。Javascript：用jquery编辑预览图

通过其他方式，我看到了一些网站，当您在该输入内输入内容时，“预览”div的原始标签即时更新。

有人可以帮我的脚本？谢谢！

<html> 
     <body> 
       <div id="preview"> 
         <label id="companyName" class="workExperience"> 
           This is my company 
         </label> 
         <label id="companyCountry" class="workExperience"> 
           This is my company Country 
         </label> 
         <input type="button" value="edit"/> 
       </div> 
       <div id="edit"> 
         <label>Company Name: </label> 
         <input type="text" id="companyName" /> 
         <label>Company Country: </label> 
         <input type="text" id="companyCountry" /> 
       </div> 
     </body> 
</html>

来源

2010-08-11 BoDiE2003

你可以使用类似下面的东西。但请注意，我将字段的id更改为不同。在同一页面上给同一个ID多个控件并不是一个好习惯。有些浏览器不适用于此，它确实没有任何意义。

$(document).ready(
    function() 
    { 
     $("#companyNameText").keypress(
      function() 
      { 
       $("#companyNameLabel").html(this.value); 
      }); 

     $("#companyCountryText").keypress(
      function() 
      { 
       $("#companyCountryLabel").html(this.value); 
      }); 
    });

来源

2010-08-11 19:25:34 spinon

它的工作，但它削减为什么我键入的最后一个字符，它不显示它，除非我在它后面添加另一个字符。 – BoDiE2003 2010-08-11 19:32:14

将'keypress'改为'keyup'。 – SLaks 2010-08-11 19:41:08

是的好点。谢谢@SLaks。 – spinon 2010-08-11 19:43:15

Javascript：用jquery编辑预览图

回答

相关问题