В приведенном ниже коде у меня есть два селектора jQuery, которые работают корректно. Есть ли причина сделать это вместо другого, или есть другой предпочтительный способ?
var val1 = $("#username", this.el ).val()
var val2 = $(this.el).find("#username").val();
Я знаю, что не должно быть нескольких элементов с одним и тем же идентификатором, но если есть несколько элементов с одним и тем же идентификатором, то какой лучший способ выбрать только элемент в представлении (см. пример ниже для имени пользователя).
<body>
Username: <input type="text" id="username" /><br />
<br /><br />
<div id="login">
Username: <input type="text" id="username" /><br />
<button id="loginButton">Login</button>
</div>
<script type="text/javascript">
var LoginView = Backbone.View.extend({
el: "#login",
events: {
"click #loginButton": "login"
},
login: function () {
var val1 = $("#username", this.el ).val()
var val2 = $(this.el).find("#username").val();
console.log(val1);
console.log(val2);
}
})
var loginView = new LoginView();
</script>
</body>
--------------------- Обновить ------------------------
Я создаю пример jsFiddle, чтобы мог быть рабочий пример для других. http://jsfiddle.net/BarDev/9QpKy/
Для краткости я обычно использую Shortbone-предоставленный ярлык:
this.$('#username')
который является псевдонимом для $('#username', this.el);
Однако любой метод выбора, который вы используете, будет работать достаточно хорошо. Другие два способа, которые у вас есть в вашем примере, хороши.
Прежде всего, я предлагаю вам не иметь несколько элементов с одинаковым идентификатором на странице. Старайтесь избегать этого. Чтобы найти элемент, я думаю, что find лучше, чем выбор элемента, передающего контекст, потому что контекст хорош для производительности, но find быстрее, чем context, поэтому он лучше, а также более компактен и читабель.
var val2 = $(this.el).find("#username").val();