2014-02-02 2 views
0

Я добавил некоторые элементы ввода, которые не являются частью стандартных входных элементов HTML. Например, у меня есть «точечный образ», где вы можете поместить «булавки», щелкнув по нему. Это изображение определяются некоторой HTML кода, как это:Можно добавить динамически новое: вход в jQuery?

<div class="pinpoint"> 
    <img src="..." alt="" title="" maxpins="10" /> 
</div> 

Проблема заключается в том, что я не могу рассматривать этот новый пункт как JQuery: вход как <input>, <textarea> или <select>. Я интересно, если есть возможность добавлять динамически div.pinpoint к JQuery: входной набор, так что я могу запустить:

$(":input").hide() 

скрыть все входы, включая мое заострить изображение.

+0

это поможет вам.? http://www.jameswiseman.com/blog/2010/04/19/creating-a-jquery-custom-selector/ –

+0

Это очень интересно @RajaprabhuAravindasamy, в этой статье объясняется, как добавлять новые псевдоселектора, но не рассказывает, как перегружать существующие. Я немного поработаю над этим. – Ivan

ответ

1

Регулярные выражения, проверяющие теги, определяются как vars в закрытии, поэтому вы не можете их изменить без изменения jQuery, что было бы невероятно плохим.

И, что более важно, существующий или будущий код, основанный на селекторе :input, может вполне обоснованно полагаться на то, что он обычно представляет. Похоже, еще одна плохая идея нарушить их предположение.

Но у вас есть обходные пути.

Например, вы можете определить строку ПОСТОЯННЫЕ:

var inputs = ':input,.pinpoint'; 

позволяет сделать

$(inputs).hide() 
+0

Да, я знаю, но я использую унаследованный код, и есть сотни мест, где мне нужно это делать. Это будет отличная экономия времени и экономия от ошибок, если я смогу использовать существующие «: input» селектора – Ivan

+2

@Ivan. У вашей IDE есть возможности _find_ и _replace_? – undefined

+0

Да, но, как вы знаете, поиск и замена подвержены ошибкам :) Во всяком случае, я нашел способ сделать это. Спасибо. – Ivan

0

Как @dystroy упоминает изменения источника JQuery, обычно не является хорошей идеей, вы можете использовать возможность поиска и замены вашей среды IDE для изменения всех селекторов. Однако, если у вас есть разумная потребность в смене селектора, вы можете управлять источником. JQuery использует шипение двигатель для выбора элементов, вы можете изменить :input selector:

"input": function(elem) { 
      return rinputs.test(elem.nodeName) 
    /* + */  || elem.className.split(' ').indexOf('pinpoint') > -1 
    /* +   && elem.nodeName.toLowerCase() === 'div'; */ 
}, 

Array.prototype.indexOf не поддерживается IE8 и ниже.

+0

Пожалуйста, загляните в мой собственный ответ.Не обязательно изменять исходный код jQuery. – Ivan

0

Благодаря the link @RajaprabhuAravindasamy опубликовал в комментариях и после некоторых исследований я обнаружил, как сделать это путем перегрузки :input селектор:

$.extend($.expr[':'], { 
    input: function(elem) { 
     return /input|select|textarea|button/i.test(elem.nodeName) || 
       $(elem).is('div.pinpoint'); 
    } 
}); 

Еще одна интересная ссылка, чтобы узнать, которые являются псевдо по умолчанию -класс выражение селектора this, где вы можете найти этот список, который я использовал, чтобы обновить мой пользовательский :input селектор:

animated=function (a){return c.grep(c.timers,function(b){return a===b.elem}).length} 
button=function (g){return"button"===g.type||g.nodeName.toLowerCase()==="button"} 
checkbox=function (g){return"checkbox"=== 
g.type} 
checked=function (g){return g.checked===true} 
disabled=function (g){return g.disabled===true} 
empty=function (g){return!g.firstChild} 
enabled=function (g){return g.disabled===false&&g.type!=="hidden"} 
file=function (g){return"file"===g.type} 
has=function (g,h,k){return!!o(k[3],g).length} 
header=function (g){return/h\d/i.test(g.nodeName)} 
hidden=function (a){var b=a.offsetWidth,d=a.offsetHeight,f=a.nodeName.toLowerCase()==="tr";return b===0&&d===0&&!f?true:b>0&&d>0&&!f?false:c.curCSS(a,"display")==="none"} 
image=function (g){return"image"===g.type} 
input=function (g){return/input|select|textarea|button/i.test(g.nodeName)} 
parent=function (g){return!!g.firstChild} 
password=function (g){return"password"===g.type} 
radio=function (g){return"radio"===g.type} 
reset=function (g){return"reset"===g.type} 
selected=function (g){return g.selected===true} 
submit=function (g){return"submit"===g.type} 
text=function (g){return"text"===g.type} 
visible=function (a){return!c.expr.filters.hidden(a)} 
Будет ли
Смежные вопросы