Question

我有一个用JQuery 1.4制作的例子

这是html：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
 "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>Formularseite</title>
    <link href="style3.css" rel="stylesheet" type="text/css" media="all" />
    <script type="text/javascript" src="js/jquery-1.7.js" ></script>
    <script type="text/javascript" src="js/meineScripts.js" ></script>
  </head>
  <body>
<?php
if (isset($_POST['senden']))
{

}
else { ?>
    <form action="formular.php" method="POST" enctype="Multipart/Formdata"> 
      <fieldset>
        <legend>Demo1 JQuery</legend>
        <label for="auswahl1">Auswahl treffen:</label>
        <input class="grouptrigger" type="checkbox" id="auswahl1" name="daten[0]" value="true"/>
        <br/>
        <div class="auswahl1 hide_on_start">
          <label for="eineZeile">Text:</label>
          <input type="text" id="eineZeile" name="daten[1]" value=""/>
        </div>
        <input class="grouptrigger" type="radio" id="auswahl2a" name="daten[2]" value="1" />
        <label for="auswahl2a">Option 1</label>
        <input class="grouptrigger" type="radio" id="auswahl2b" name="daten[2]" value="2" />
        <label for="auswahl2b">Option 2</label>
        <input class="grouptrigger" type="radio" id="auswahl2c" name="daten[2]" value="3" />
        <label for="auswahl2c">Option 3</label>
        <div class="hide_on_start auswahl2a">
          <label for="eineZeile2a">Text Opt1:</label>
          <input type="text" id="eineZeile2a" name="daten[3]" value=""/>
        </div>
        <div class="hide_on_start auswahl2b">
          <label for="eineZeile2b">Text Opt2:</label>
          <input type="text" id="eineZeile2b" name="daten[4]" value=""/>
        </div>
        <div class="hide_on_start auswahl2c">
          <label for="eineZeile2c">Text Opt3:</label>
          <input type="text" id="eineZeile2c" name="daten[5]" value=""/>
        </div>
        <br/>
        <label for="auswahl3">Auswahl treffen:</label>
        <select name="daten[6]" id="auswahl3" class="grouptrigger">
          <option value="0" >Bitte wählen:</option>
          <option value="1" id="auswahl3a" >Eintrag</option>
          <option value="2" id="auswahl3b" >anderer Eintrag</option>
          <option value="3" id="auswahl3c" >weiterer Eintrag</option>
        </select>
        <div class="hide_on_start auswahl3a">
          <label for="eineZeile3a">Text 1:</label>
          <input type="text" id="eineZeile3a" name="daten[7]" value=""/>
        </div>
        <div class="hide_on_start auswahl3b">
          <label for="eineZeile3b">Text 2:</label>
          <input type="text" id="eineZeile3b" name="daten[8]" value=""/>
        </div>
        <div class="hide_on_start auswahl3c">
          <label for="eineZeile3c">Text 3:</label>
          <input type="text" id="eineZeile3c" name=""/>
        </div>        
      </fieldset>
      <p class="font20px"><input type="submit" name="senden" value="Abschicken"></p>
    </form>
<?php } ?>
  </body></html>

这是js：

// Add RegExp Filter
// From: http://james.padolsey.com/javascript/regex-selector-for-jquery/
$.expr[':'].regex = function(elem, index, match) {
  var matchParams = match[3].split(','),
    validLabels = /^(data|css):/,
    attr = {
      method: matchParams[0].match(validLabels) ? 
            matchParams[0].split(':')[0] : 'attr',
      property: matchParams.shift().replace(validLabels,'')
    },
    regexFlags = 'ig',
    regex = new RegExp(matchParams.join('').replace(/^\s+|\s+$/g,''), regexFlags);
  return regex.test(jQuery(elem)[attr.method](attr.property));
}

$(document).ready(function() {
  $('body').addClass('js');

  // Toggeling groups
  $(".grouptrigger").change( function() 
  {
    var toCheck = ":not(:checked)";
    if ($(this).hasClass('inverse'))
      toCheck = ":checked";
    var hideGroup = "."+this.id;
    // for radio buttons
    alert (" "+$(this).attr('type')+' '+this.id);
    if ($(this).attr('type') == "radio")
    {
      var hideGroupParent=hideGroup.substr(0,hideGroup.length-1);
      try { $("div:regex(class, .*"+hideGroupParent+".*)").hide(0); } catch (err) {}
      if ($("#" + this.id).is(":checked")) 
        $(hideGroup).show(0);
    }
    // for select lists
    else if ($(this).attr('type') == "select-one")
    {
      var hideGroupParent=this.id;
      hideGroup = '.'+$('#' + this.id + ' :selected').attr('id');
      try { $("div:regex(class, .*"+hideGroupParent+".*)").hide(0); } catch (err) {}
      $(hideGroup).show(0);
    }
    else
    // for checkboxes
    {
      if ($("#" + this.id).is(toCheck)) 
        try { $(hideGroup).hide(100); } catch (err) {}
      else
        $(hideGroup).show(100);
    }
  });
  $(".grouptrigger").change();
});

JQuery 1.7的问题在于

alert (" "+$(this).attr('type')+' '+this.id);

对于select而不是'select-one'，

产生'undefined'，就像JQuery 1.4一样。这是一个错误还是有其他方法来检测选择元素？

Answer 1

在jquery网站上，您可以找到此信息

从jQuery 1.6开始，.attr（）方法为尚未设置的属性返回undefined。此外，.attr（）不应用于普通对象，数组，窗口或文档。要检索和更改DOM属性，请使用.prop（）方法。

所以请使用prop('type')

Answer 2

嗯，从技术上讲，select没有type属性（如果它有一个，那就是HTML错误），所以它不是bug，而是jQuery 1.7的一个特性。如果你想挑出select只需使用其中任何一个：

$(this).is('select') === true
$(this).filter('select').length > 0

用于select的JQuery 1.7 $（this）.attr（'type'）给出undefined而不是“select-one” - 为什么？

2 个答案: