2010-08-11 118 views
1

如何獲取功能showEditionBlock()中標籤元素的當前值並將它們設置爲相應的輸入字段?該功能將顯示「編輯」div,但輸入未獲得標籤的原始值。將輸入字段設置爲標籤元素的當前值

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

</head> 
<script> 
$(document).ready(
    function() 
     { 

      $("#companyNameText").keyup(
      function() 
      { 
       $("#companyNameLabel").html(this.value); 
      }); 

      $("#companyCountryText").keyup(
      function() 
      { 
       $("#companyCountryLabel").html(this.value); 
      }); 
    }); 
function showEditionBlock(){ 
    //$("div#edit").css('display','block').fadeIn("slow"); 
    $("div#edit").fadeIn('slow', function(){ 
      $(this).css('display', 'inline'); 
     }); 
    } 

function hideEditionBlock(){ 
    //$("div#edit").css('display','block').fadeIn("slow"); 
    $("div#edit").fadeOut('slow', function(){ 
      $(this).css('display', 'none'); 
     }); 
    } 



</script> 
     <body> 
       <div id="preview"> 
      <fieldset> 
         <label id="companyNameLabel" class="workExperience"> 
           This is my company 
         </label> 
         <label id="companyCountryLabel" class="workExperience"> 
           This is my company Country 
         </label> 
         <input type="button" value="edit" onclick="showEditionBlock();"/> 
      </fieldset> 
       </div> 
       <div id="edit" style="display:none;"> 
      <fieldset> 
         <label>Company Name: </label> 
         <input type="text" id="companyNameText" /> 
         <label>Company Country: </label> 
         <input type="text" id="companyCountryText" /> 
         <input type="button" value="Ok" onclick="hideEditionBlock();"/> 
      </fieldset> 
       </div> 
     </body> 
</html> 

回答

1

您應該指定標籤的innerHTMLvalue S的投入。在純醇」的Javascript,你可以這樣做:

document.getElementById("companyNameText").value = 
    document.getElementById("companyNameLabel").innerHTML; 
document.getElementById("companyCountryText").value = 
    document.getElementById("companyCountryLabel").innerHTML; 

使用jQuery,這是相同的:

$("#companyNameText").val($("#companyNameLabel").html()); 
$("#companyCountryText").val($("#companyCountryLabel").html()); 
相關問題