Question

我有一个包含两个文本框的表（textbox1，textbox2）。两个文本框都是必需的。如果我没有在textbox1中输入值并输入值textbox2，反之亦然，我应该收到一条错误消息。我们怎样才能用jQuery实现这个目标？

Answer 1

我发现这样做的最简单方法是在文本框中添加一个类，例如'requiredField'。

<input type="text" class="requiredField" />

然后，您可以使用“查找”功能获取表格中的所有必填字段。

textboxes = $('#tableid').find('.requiredField');

然后使用'each'函数迭代它们

textboxes.each(function() {
    if(this.value.length==0){
        //do something here
    }
}

通过这样的方式，我通常会将文本框的边框设置为红色，并添加一个警告，告诉用户必须填写所有必填字段。

这是最终的代码。

requiredFields = $('#tableid').find('.requiredField');
var allFieldsComplete = true;
requiredFields.each(function(index) {
    if (this.value.length == 0) {
        $(this).addClass('requiredIncomplete');
        allFieldsComplete = false;
    } else {
        $(this).removeClass('requiredIncomplete');
    }
});
if(!allFieldsComplete){
    alert('Please complete all required fields');
}
return allFieldsComplete;

您还需要在CSS中指定'requiredIncomplete'样式。这将做的是检查表中的所有文本框，看它们是否包含数据。如果文本框不包含数据，则会向其添加“requiredIncomplete”类（其中包含一些样式以将其与其他文本框区分开），否则将删除该类。如果所有字段都包含数据，则返回true;如果其中一个字段缺少数据，则返回false。

Answer 2

// create a custom jQuery expression filter, called :hasValue
jQuery.expr[':'].hasValue = function(elem, index, match) {
    return jQuery(elem).val() !== '';
};

// textbox logic
if($('table textbox:hasValue').length !== 2) {
  alert('error message');
}

Answer 3

$("[id^=textboxid]").each(function(){               
    if ($(this).val().length > 0) {
      // do something alert ...
       }                
    }
);

这会运行所有文本框，id以textboxid开头，例如textboxid1，textboxid2 ......

Answer 4

假设您确实有一个表单，并希望在提交表单时进行此验证，首先，请添加警告消息：

<p class="warning">Both textboxes need to be filled</p>

然后，添加以下Javascript

$('form').submit(function(){
  var inputValid = true;

  $('form textarea').each(function(){
    if(!this.value){
      $('.warning').show();
      return false;
    }
  });
});

在提交表单时，这将循环显示所有textearea，并显示错误消息，并在<{>任何 {{1}时取消表单提交表单中的s未填充。

Answer 5

Table Table1 = new Table(mainShell,SWT.BORDER);
    Table1.setHeaderVisible(true);
    Table1.setLinesVisible(true);
    TableColumn tc1 = new TableColumn(Table1,SWT.NONE);
    tc1.setText("Item");
    tc1.setWidth(100);
    TableColumn tc2 = new TableColumn(Table1,SWT.NONE);
    tc2.setText("Value");
    tc2.setWidth(120);
    TableItem item1 = new TableItem(Table1,SWT.NONE);
    item1.setText(0, "hahaha");
    item1.setText(1, "haha");
    Table1.setBounds(9, 174, 228, 128);

遍历表中的所有文本框并检查值

5 个答案: