什么是jquery find()的选择器来选择具有属性的元素而没有具有特定类的父元素?

时间:2018-03-08 12:44:41

标签: jquery jquery-selectors

这是我尝试过的

 $(".stemValueScope[data-stemValueId*="+stemValueId+"]").find("*:not(.stemValueScope) [required]").each(function() { ...}

但由于我没有得到的原因,当我只想要一个不在stemValueScope

元素中的必需元素时,所有[required]元素都会被选中

(目的是仅在所选元素属于已检查问题的范围内时识别所需元素,但您实际上并不需要理解这一点,因为SO所说的问题主要是代码......)

问题实际上只是关于jquery语法:我可以将:not()放在find()选择器中,或者如何对元素{{1}中的所有[必需]元素进行each()处理但不在".stemValueScope[data-stemValueId*="+stemValueId+"]"

的另一个元素中

请使用小部件尝试...

.stemValueScope
$(document).ready(function() { // au chargement de la page affiche / masque stemValueScope si $stemValue cochée / décochée
        $("input.stemValue:checked").each(function() {
            var stemValueId=$(this).attr("id");
            $(".stemValueScope[data-stemValueId="+stemValueId+"]").removeClass("hidden");
            $(".stemValueScope[data-stemValueId="+stemValueId+"]").show();
        });
        $("input.stemValue:not(:checked)").each(function() {
            var stemValueId=$(this).attr("id");
            //console.log(".stemValueScope[data-stemValueId="+stemValueId+"]");
            //console.log($(".stemValueScope[data-stemValueId="+stemValueId+"]").length);
            $(".stemValueScope[data-stemValueId="+stemValueId+"]").hide();
        });
    });

$("input:radio[name], input:checkbox[name]").click(function () { // affiche / masque stemValueScope si $stemValue cochée / décochée
        var name = $(this).attr("name");
            name = name.replace("[","\\[").replace("]","\\]");
        $("input.stemValue[name="+name+"]:not(:checked)").each(function() {
            var stemValueId=$(this).attr("id");
            $(".stemValueScope[data-stemValueId~="+stemValueId+"]").hide();
            $(".stemValueScope[data-stemValueId~="+stemValueId+"]").find("input").prop('checked', false); // vide stemValueScope si stemValue décochée
            $(".stemValueScope[data-stemValueId~="+stemValueId+"]").find("input:not([type=radio], [type=checkbox])").val(""); // vide stemValueScope si stemValue décochée
            $(".stemValueScope[data-stemValueId~="+stemValueId+"]").find("textarea").val(""); // vide stemValueScope si stemValue décochée
        });
        $("input.stemValue[name="+name+"]:checked").each(function() {
            var stemValueId=$(this).attr("id");
            //console.log(".stemValueScope[data-stemValueId*="+stemValueId+"]");
            //console.log($(".stemValueScope[data-stemValueId*="+stemValueId+"]").length);
            $(".stemValueScope[data-stemValueId~="+stemValueId+"]").removeClass("hidden");
            $(".stemValueScope[data-stemValueId~="+stemValueId+"]").show();
        });
    });
    
    
     $(".record").click(function() {
     var formId = $(this).closest("form").attr('id');
     var isValid=true;
        
       $("#" + formId +" input.stemValue:checked").each(function() { // pour toutes les stemValue cochées vérifie que les champs required sont saisis
            var stemValueId=$(this).attr("id");
            // vérifie que dans le stemValueScope tous les inputs avec un attribut required sont bien renseignés
            $(".stemValueScope[data-stemValueId*="+stemValueId+"]").find("*:not(.stemValueScope) [required]").each(function() {
                var name =$(this).attr("name");
                if ($(this).attr('type') == "radio") {
                    var value = $("[name="+name+"]:checked").val();
                } else {
                    var value = $(this).val();
                }
                console.log("required in stemValueScope de "+stemValueId+" : "+name+" = "+value);
                if ( (!$(this).hasClass(".jq-allowZero") && value == "0" ) || value == "" || value === undefined || value == "\\N" ) {
                    isValid = false;
                    console.log(isValid);
                    alert('Merci de renseigner '+name);
                }
            });
     });
     if (isValid)  alert('form ok');
     })

2 个答案:

答案 0 :(得分:0)

  

jquery find()的选择器是什么选择具有属性的元素而没有具有特定类的父元素?

首先需要选择具有$('[yourAttribute]')属性的每个元素。

然后你需要filter那些父母与某个班级的人。您可以通过查看$(this).closest('.parentClass').length是否返回0来轻松测试。

var result = $('[data-test]').filter(function(){
  return $(this).closest('.test').length;
});

console.log(result.length);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="test">
  <p data-test="whatever"><p>
</div>
<div>
  <p data-test="whatever"><p>
</div>

答案 1 :(得分:0)

这就是我需要的:

`$("#" + formId +" input.stemValue:checked").each(function() { 

        var stemValueId=$(this).attr("id");

        $(".stemValueScope[data-stemValueId*="+stemValueId+"]").find("[required]").each(function() {

            if($(this).closest('.stemValueScope').attr("data-stemValueId")==stemValueId) {
                var name =$(this).attr("name");
                //name = name.replace("[","\\[").replace("]","\\]");
                if ($(this).attr('type') == "radio") {
                    var value = $("[name="+name+"]:checked").val();
                } else {
                    var value = $(this).val();
                }
                if (<?= $cfg['debug']."0" ?>) { console.log("required in stemValueScope de "+stemValueId+" : "+name+" = "+value);}
                if ( (!$(this).hasClass(".jq-allowZero") && value == "0" ) || value == "" || value === undefined || value == "\\N" ) {
                    isValid = false;
                    console.log(isValid);
                    $(this).notify('Merci de renseigner', { className: "error",position: "top middle" });
                }
            }
        });

               });

必须添加一个测试,以查看带有closest()的{​​{1}}项是否是要检查stemValueScope项的项,而不是嵌套的必需项...

[required]