jQuery Selectors and $(this)

Question

我有一个有趣的选择器语句：

$("span#dateofbirth").bind('click', function() {
  $("span#dateofbirth>form>input.inplace_field").blur();
  $("span#dateofbirth>form>input.inplace_field").removeClass("inplace_value");
  $("span#dateofbirth>form>input.inplace_field").datepicker({dateFormat:'yy-mm-dd'});
  $("span#dateofbirth>form>input.inplace_field").addClass("inplace_value");
  $("span#dateofbirth>form>input.inplace_field").focus();
});

它实际上是由其他人插入的，以使jQuery UI日期选择器与Edit-in-Place插件一起使用。它似乎更像是一个黑客/创可贴。但它有效。

我想

继续使用它，但我想修改它以使其对任何带有 Date 的元素更加全局。

所以，我给跨度上了一类.datepicker

但是，它并不完全有效，因为绑定更喜欢特定的 ID，以本地化到该元素。

有没有办法解决这个问题，也许使用 $(this) ，结合选择器语句的其余部分？

也许是类似的东西？

$("span.datepicker").bind('click', function() { 
  $(this+">form>input.inplace_field").blur();
});

Answer 1

使用.find()

$(this).find(">form>input.inplace_field")

或

$(">form>input.inplace_field" , this)  // Provide a context to search in

.JS

$("span#dateofbirth").bind('click', function() {
  $(">form>input.inplace_field" , this).blur()
          .removeClass("inplace_value")
          .datepicker({dateFormat:'yy-mm-dd'})
          .addClass("inplace_value")
          .focus();
});

应chain或cache选择器以减少查询 DOM 的次数。

Answer 2

选择器是普通字符串。

你正在尝试写作

$(this).find(">form>input.inplace_field")

Answer 3

子选择器 > 现在在 jQuery 选择器中被弃用（在 CSS 中仍然正常）。

您应该使用以下行：

$(".datepicker").on('click', function() {
  $(this).children("form").children("input.inplace_field").blur()
          .removeClass("inplace_value")
          .datepicker({dateFormat:'yy-mm-dd'})
          .addClass("inplace_value")
          .focus();
});