1

この JS Fiddleを考えると、なぜこのように動作するのか誰にもわかりますか? コンソールを見ると、エレメント ID とそのタグ名が :not メソッドまたは .not メソッドの下にリストされているのがわかります。論理的に、要素を選択するステートメントが同じ要素になることに注意してください。何らかの理由で :not は 2 つの要素しか返さないのですが、.not は 11 を返します (私の計算では正しい数です)。

誰かが私のロジックが正しく、実際にバグがあることを安心させるか、最初のステートメントで何が間違っているかを教えてもらえますか?

編集：コードは次のとおりです。

HTML:

<input id="TITLE" class="reginput" name="TITLE" type="TEXT" size="15" maxlength="15" value="test">
<input id="FIRSTNAME" class="reginput" name="FIRSTNAME" type="TEXT" size="30" maxlength="50" value="test">
<input id="SURNAME" class="reginput" name="SURNAME" type="TEXT" size="30" maxlength="80" value="test">
<input id="EMPNO" class="reginput" name="EMPNO" type="TEXT" size="30" maxlength="50" value="">
<select name="day_DOB" id="day_DOB" class="feday"><option value="0">Day</option></select>
<select name="month_DOB" id="month_DOB" onblur="dodatecheck_data_DOB(this,document.data.day_DOB,document.data.year_DOB,'MONTH');" class="femonth"><option value="0" selected="">Month</option></select>
<select name="year_DOB" id="year_DOB" onblur="dodatecheck_data_DOB(document.data.month_DOB,document.data.day_DOB,this,'YEAR');" class="feyear"><option value="0">Year</option></select>
<input class="reginput" id="HOMEPHONENO" maxlength="50" type="TEXT" name="HOMEPHONENO" size="15" value="">
<input class="reginput" id="WORKPHONENO" maxlength="50" type="TEXT" name="WORKPHONENO" size="15" value="">
<input class="reginput" id="MOBILEPHONENO" maxlength="50" type="TEXT" name="MOBILEPHONENO" size="15" value="">
<input id="JOBTITLE" class="reginput" name="JOBTITLE" type="TEXT" size="30" maxlength="100" value="">
<input id="COMPANYNAME" class="reginput" name="COMPANYNAME" type="TEXT" size="30" maxlength="100" value="">
<select id="CandGeneralField5" name="CandGeneralField5" class="reginput"><option value="0">&lt; Please select &gt;</option><option value="12">Female</option><option value="11">Male</option><option value="13">Prefer not to disclose</option></select>​

jQuery (1.7.2 を使用):

$(document).ready(function() {
    console.log(":not method");
    $elems = $("input[type=text][id], select[id]:not(select#month_DOB, select#year_DOB), textarea[id], tr input[type=submit][id]");
    $elems.each(function() {
            console.log("\t" + $(this).attr("id") + " - " + this.nodeName.toLowerCase());
    });
    console.log("\tCount: " + $elems.length);    
    console.log(".not method");
    $elems = $("input[type=text][id], select[id], textarea[id], tr input[type=submit][id]")
      .not("select#month_DOB, select#year_DOB");
      $elems.each(function() {
            console.log("\t" + $(this).attr("id") + " - " + this.nodeName.toLowerCase());
      });          
    console.log("\tCount: " + $elems.length);    
});​

編集：明確にするために、私の論理は、両方の場合で以下を選択する必要があるということです：

  • ID を持つテキスト入力。
  • id を持つが select#month_DOB または select#year_DOB を持たないものを選択します。
  • ID を持つテキストエリア。
  • id を持ち、tr 内にある送信タイプの入力。

PSマークアップがゴミであることは知っています-それは私が取り組んでいる製品のコアコードによって出力されており、それについて私にできることは何もありません..ああ、できれば変更したいことがたくさんあります:)

4

3 に答える 3

1

:not のように、連鎖セレクターを使用しないよう:not(#id1, #id2)です。代わりに、する必要があります:not(#id1):not(#id2)。

ここにあなたのフィドルの修正版があります: http://jsfiddle.net/jackwanders/EM5FP/

なぜそれが機能しないのかについては、jQuery 開発者に任せるのが最善の質問かもしれません。

于 2012-07-03T17:33:15.693 に答える
1

select[id]:not(select#month_DOB, select#year_DOB)最初の位置に置くと、次のように機能します。

$elems = $("span#volumemaindetails")
  .find("select[id]:not(select#month_DOB, select#year_DOB), input[type=text][id], textarea[id], tr input[type=submit][id]");

更新された例も参照してください。理由を聞かないでください:-)

===更新===

たぶん、次は@jackwandersの答えを説明できます：

否定疑似クラスの w3c css3 定義から:

否定疑似クラス: not(X)は、単純なセレクター(否定疑似クラス自体を除く) を引数として取る関数表記です。

単純なセレクターは次のように定義されます。

単純なセレクターは、タイプ セレクター、ユニバーサル セレクター、属性セレクター、クラス セレクター、ID セレクター、または疑似クラスのいずれかです。

セレクター (セレクターのグループ) またはタイプと ID セレクターの組み合わせでコンマが許可されていないという事実を解釈します。

jQueryのnot()メソッドは、おそらく CSS3 で許可されている以上のものを許可します。
（彼らはそれを機能と呼びます;-)）

于 2012-07-03T17:35:42.263 に答える
1

jQuery の新しいバージョンのバグのようです。

jQuery 1.4.4で正常に動作します

デモ

于 2012-07-03T18:10:26.293 に答える