2016-04-28 47 views
2

我有一個表,文本區域和按鈕 ,我想,當文本區是空的按鈕禁用和啓用時不爲空或用戶填寫文本區域的jQuery禁用每個按鈕

這是我的HTML代碼示例 我使用PHP循環用於生成此表

<table> 
<tr> 
<td><textarea name="text1" id="text1"></textarea></td> 
<td><input type="button" class="btn btn-primary" id="btn1"></td> 
</tr> 
<tr> 
<td><textarea name="text2" id="text2"></textarea></td> 
<td><input type="button" class="btn btn-primary" id="btn2"></td> 
</tr> 
<tr> 
<td><textarea name="text3" id="text3"></textarea></td> 
<td><input type="button" class="btn btn-primary" id="btn3"></td> 
</tr> 
</table> 

禁用按鈕我想使用addclass「禁用」,romoveclass「enabeled」 和enabeling使用addclass「enabeled」和removeclass「禁用」

請幫我用jquery。

+0

不要ü想一次或一個禁止在同一時間所有的按鈕? –

+0

如果text1爲空,則禁用button1。 如果text2爲空,則禁用button2。 如果text3爲空,則禁用按鈕3. 。等等 –

回答

0

之前 THX你可以做這樣的事情:

$('textarea').on('keyup keydown keypress change paste', function() { 
 
    if ($(this).val() === '') { 
 
     $(this).closest('tr').find('.btn').removeClass('enabled').addClass('disabled') 
 
    } else { 
 
     $(this).closest('tr').find('.btn').removeClass('disabled').addClass('enabled') 
 
    } 
 
    });
.disabled { 
 
    color: red; 
 
    } 
 

 
.enabled { 
 
    color: green; 
 
    }
You can do something like this: 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<table> 
 
<tr> 
 
<td><textarea name="text1" id="text1"></textarea></td> 
 
<td><input type="button" class="btn btn-primary disabled" id="btn1" value="Submit"></td> 
 
</tr> 
 
<tr> 
 
<td><textarea name="text2" id="text2"></textarea></td> 
 
<td><input type="button" class="btn btn-primary disabled" id="btn2" value="Submit"></td> 
 
</tr> 
 
<tr> 
 
<td><textarea name="text3" id="text3"></textarea></td> 
 
<td><input type="button" class="btn btn-primary disabled" id="btn3" value="Submit"></td> 
 
</tr> 
 
</table>

+0

awazing,這就像我想要的工作。這一切都是爲了幫助我 –