jquery基于选择的动态验证

发布于 2024-11-02 08:34:56 字数 1013 浏览 0 评论 0原文

我有下面的 jquery 代码,我循环遍历一个 div 并找到 2 个下拉菜单和 1 个文本框。

所以基本上 div 中的每一行都会有 2 个 HTML SELECT 和 1 个输入类型文本框

我想根据这 2 个 HTML 选择的选定值对文本框进行验证。

例如:如果我从第一个下拉列表中选择选项 1,并从第二个下拉列表中选择选项 3,那么我的文本框只能包含 20 个字符。

请告知我该怎么做。

var searchString = '';
        $("#btnSearch").click(function () {
            searchString = "";
            $("div.cloneRow").each(function () {
                if ($(this).find("input[type=text]").val() != '') {
                    $(this).find("select").each(function () {
                        if ($.trim($(this).val()) != '') {
                            searchString += $.trim($(this).val()) + " ";
                        }
                    });
                    $(this).find("input[type=text]").each(function () {
                        searchString += $.trim($(this).val());
                    });
                }
            });
            alert(searchString);
        });
    });

谢谢

I have below jquery code where I loop through a div and find 2 dropdowns and 1 text box.

So basically each row in the div will have 2 HTML SELECT and 1 input type text box

I want to put validation on the text box based on the selected value of these 2 HTML select.

So for ex: if I select option1 from 1st dropdown and elect option3 from 2nd dropdown then my textbox can only take 20 characters.

Please advice how can I do this.

var searchString = '';
        $("#btnSearch").click(function () {
            searchString = "";
            $("div.cloneRow").each(function () {
                if ($(this).find("input[type=text]").val() != '') {
                    $(this).find("select").each(function () {
                        if ($.trim($(this).val()) != '') {
                            searchString += $.trim($(this).val()) + " ";
                        }
                    });
                    $(this).find("input[type=text]").each(function () {
                        searchString += $.trim($(this).val());
                    });
                }
            });
            alert(searchString);
        });
    });

Thanks

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

成熟的代价 2024-11-09 08:34:56

每次按下按钮时,您都会在包含 2 个选择框和一个文本框的 div 上循环,对于每个文本框,您检查选择框的值并做出决定。我给出了一个示例,但它还可以进一步改进。希望有帮助

          $("#yourbuttonid").click(function(){
              $("div.cloneRow").each(function () {
                  var $select1 = $($(this).find("select.first"));
                  var $select2 = $($(this).find("select.second"));
                  var $text = $("input[type='text']");
                  if($select2.val() != ""){
                      //Your cases go in here
                      if($select1.val() == "1" && $select2.val() == "4"){
                          //check if the allowed length is exceeded for this case
                          if($text.val().length > 20){
                              //if it is empty the textbox and give a red border
                              $text.val("");
                              $text.css("border", "1px solid red");
                          }
                      }
                      //other cases go here
                  } 
              });
          });

Every time you press the button you loop over your divs that contain the 2 selectboxes and a textbox and for each textbox you check the values for the select boxes and make a decision. I gave an example case but it can be further improved. Hope it helps

          $("#yourbuttonid").click(function(){
              $("div.cloneRow").each(function () {
                  var $select1 = $($(this).find("select.first"));
                  var $select2 = $($(this).find("select.second"));
                  var $text = $("input[type='text']");
                  if($select2.val() != ""){
                      //Your cases go in here
                      if($select1.val() == "1" && $select2.val() == "4"){
                          //check if the allowed length is exceeded for this case
                          if($text.val().length > 20){
                              //if it is empty the textbox and give a red border
                              $text.val("");
                              $text.css("border", "1px solid red");
                          }
                      }
                      //other cases go here
                  } 
              });
          });
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文