2016-11-30 31 views
1

我希望每當用戶關注一個輸入框時,它應該變成只讀模式。但我有運行時生成的文本框都具有相同的類,我希望這些文本框不應變爲只讀模式,直到 用戶離開該類文本框。但是,發生的情況是,一次只有一個文本框可以有一個焦點,所以同一類的其他文本框最終只能讀取。如何在相同類別的輸入框中移動焦點時保持readonly =「false」?

e.g ..

<span id="file_div"> 
<?php foreach($arr as $skill) 
    {echo '<input readonly name="txtSkill[]" value="'.$skill.'" class="txt11"/>'; }?> 
</span> 
<input type="button" value="Edit" name="btnEdit11"id="btnXyz2" class="btn11"/> 

<input readonly name="txtQualif" value="<?= $row[15];?>" class="txt12"/> 
<input type="button" value="Edit" name="btnEdit12"id="btnXyz2" class="btn12"/> 

<script> 
$(".btn11").click(function(){ 
    $(".txt11").eq(0).focus(); // focus the first 
    $(".txt11").prop("readonly", false); 
}); 

$(".btn12").click(function(){ 
    $(".txt12").focus(); 
    $(".txt12").prop("readonly", false); 
}); 

$(".txt11").focusout(function(){ 
    $(".txt11").prop("readonly", true); 
}); 

$(".txt12").focusout(function(){ 
    $(".txt12").prop("readonly", true); 
}); 
</script> 

編輯:

我不想失去 '只讀=假',直到用戶點擊不同的類名的一個文本框。在上面例如..只要用戶點擊名稱爲txt11的類,所有類名爲txt11的texbox的readonly屬性應該只讀= false。但是,如果用戶點擊類名爲txt12的文本框,則類名爲txt11的所有文本框將設置爲只讀

+0

這是沒有意義的。你如何確定狀態是在頁面上點擊非相關項目的人員? – jeff

+0

whatcha tryna do man? – Dherya

+0

我不想鬆開'readonly = false',直到用戶單擊不同類名的文本框。在上面例如..只要用戶點擊具有名稱的類** txt11 **所有具有類名稱的texbox的只讀屬性** txt11 **應該只讀= false。但是如果用戶在類名爲** txt12 **的文本框中單擊,那麼類名爲** txt11 **的所有文本框將被設置爲只讀。 – phpNoob

回答

0

希望這個JS Fiddle可以幫助您制定解決方案。

<input type="text" readonly="true" value="123" class="test" id="test" /><br /> 
<input class="test" readonly="true" type="text" value="123" /> 
<button id="editClick"> 
Edit 
</button> 

$("#editClick").on('click', function(){ 
$('.test').attr('readonly', false); 
}); 
+2

這裏發生了什麼事。你做了什麼可以解釋它 – Dherya

1

您需要定義事件的內容對每個文本輸入字段,所以whernever特定輸入是集中了只有它會變成raedonly模式

$(".txt11").each(function(){ 
    $(this).focusout(function(){ 
      $(this).prop("readonly", true); 
    }); 
}); 
相關問題