Як выявіць, калі Enter Key была націснутая ў DIV з дапамогай JQuery?

Я паспяхова зачапіў падзея EnterKey на ўзроўні дакумента ў наступным:

    $(document).keypress(function (e) {
        if (e.which == 13) {
            alert('You pressed enter!');
        }
    });

Але, я не магу падключыць падзея EnterKey на Div з ідэнтыфікатарам «myDiv».

<div id="myDiv"></div>

$("#myDiv").keypress(function (e) {
     if (e.which == 13) {
         alert('You pressed enter!');
     } 
 });

Ці можна выявіць EnterKey прэсу ў межах Div? На самай справе, дзіваў змяшчае некаторыя ўваходныя/выбраць элементы кіравання, якія выкарыстоўваюцца для фільтрацыі змесціва сеткі. Я хачу, каб падключыць падзея EnterKey так, што пры націску EnterKey я магу фільтраваць сетку.

EDIT: Please note that I have inputs within the div(I've intentionally not shown them here). I don't want to hook the event manually for each of the input control within the Div. Also, I am assuming that when user presses EnterKey at least one input control shall have focus.

21
націск клавішы можа быць знойдзены толькі ў глабальным маштабе на $ (вокны) і ўтвараюць ўваходы.
дададзена аўтар Daniel Ruf, крыніца
націск клавішы можа быць знойдзены толькі ў глабальным маштабе на $ (вокны) і ўтвараюць ўваходы.
дададзена аўтар Daniel Ruf, крыніца
Як вы пасылаеце націск клавішы да DIV? Я маю на ўвазе, як вы адчуваць гэтае?
дададзена аўтар Halim Qarroum, крыніца

16 адказы

паспрабуйце гэта

 <div id="Div1">
    <input type ="text" id="aa"/>
    sdfsd hsjdhsj shdj shd sj
 </div>

Jquery

$(function(){
 $("#Div1 input").keypress(function (e) {
    if (e.keyCode == 13) {
        alert('You pressed enter!');
    }
 });
});

Demo

34
дададзена

паспрабуйце гэта

 <div id="Div1">
    <input type ="text" id="aa"/>
    sdfsd hsjdhsj shdj shd sj
 </div>

Jquery

$(function(){
 $("#Div1 input").keypress(function (e) {
    if (e.keyCode == 13) {
        alert('You pressed enter!');
    }
 });
});

Demo

34
дададзена

Адзіны спосаб элемент DOM можа атрымаць ключавыя падзеі, то, калі ў яго ёсць <�фокус/EM>.

Альбо ўсталяваць фокус на ваш DIV у onready апрацоўшчык:

$(function() {
   $('#mydiv').focus();
});

Ці даць фокус вашага элемента праз TabIndex атрыбут .

EDIT : As @roasted explained, you can also set a CSS rule to your div to avoid restyling issues :

#myDiv {
  outline: 0 solid;
}
4
дададзена
можна выкарыстоўваць у дадатак CSS: #myDiv {контуру: 0}, каб пазбегнуць актыўнага элемента рэстайлінг
дададзена аўтар A. Wolff, крыніца
але ён страціць фокус вельмі лёгка ;-)
дададзена аўтар Daniel Ruf, крыніца
Вядома, але ён, па меншай меры, мець магчымасць атрымліваць падзеі. Таму ключавыя падзеі, як правіла, апрацоўваюцца ўваходы элементаў.
дададзена аўтар Halim Qarroum, крыніца

Адзіны спосаб элемент DOM можа атрымаць ключавыя падзеі, то, калі ў яго ёсць <�фокус/EM>.

Альбо ўсталяваць фокус на ваш DIV у onready апрацоўшчык:

$(function() {
   $('#mydiv').focus();
});

Ці даць фокус вашага элемента праз TabIndex атрыбут .

EDIT : As @roasted explained, you can also set a CSS rule to your div to avoid restyling issues :

#myDiv {
  outline: 0 solid;
}
4
дададзена
можна выкарыстоўваць у дадатак CSS: #myDiv {контуру: 0}, каб пазбегнуць актыўнага элемента рэстайлінг
дададзена аўтар A. Wolff, крыніца
але ён страціць фокус вельмі лёгка ;-)
дададзена аўтар Daniel Ruf, крыніца
Вядома, але ён, па меншай меры, мець магчымасць атрымліваць падзеі. Таму ключавыя падзеі, як правіла, апрацоўваюцца ўваходы элементаў.
дададзена аўтар Halim Qarroum, крыніца

Што вам сапраўды трэба зрабіць, тут звязаць націск падзея ўсе элементы формы, такія як ўвод, выберыце і тэкставае поле ўнутры DIV, як:

$("#myDiv input, select, textarea").keypress(function (event) {
    if (event.which == 13) {
        event.preventDefault();
        alert('You pressed enter!');
    }
});

Галоўнае, каб заўважыць тут з'яўляецца выкарыстанне event.preventDefault() </а >. Так, калі вы не выкарыстоўваеце яго, націснуўшы клавішу ўводу можа прывесці да адпраўкі формы, якую вы відавочна не хочаце тут. Вы проста хочаце, каб націснуць клавішу ўводу, каб фільтраваць змесціва сеткі. Такім чынам, як толькі будзе націснутая клавіша ўводу вы можаце атрымаць значэння з ўваходных элементаў і фільтраванне сеткі адпаведна.

3
дададзена

Што вам сапраўды трэба зрабіць, тут звязаць націск падзея ўсе элементы формы, такія як ўвод, выберыце і тэкставае поле ўнутры DIV, як:

$("#myDiv input, select, textarea").keypress(function (event) {
    if (event.which == 13) {
        event.preventDefault();
        alert('You pressed enter!');
    }
});

Галоўнае, каб заўважыць тут з'яўляецца выкарыстанне event.preventDefault() </а >. Так, калі вы не выкарыстоўваеце яго, націснуўшы клавішу ўводу можа прывесці да адпраўкі формы, якую вы відавочна не хочаце тут. Вы проста хочаце, каб націснуць клавішу ўводу, каб фільтраваць змесціва сеткі. Такім чынам, як толькі будзе націснутая клавіша ўводу вы можаце атрымаць значэння з ўваходных элементаў і фільтраванне сеткі адпаведна.

3
дададзена

Ваша пытанне можа быць больш дакладным - вы хочаце, каб выявіць Keypressed падзеі на ўваход аб'екце ўкладзенага джгутоў пэўнага DIV. Можа быць, вы маглі б паспрабаваць:

$("#myDiv input,select").keypress(function (e) {
        if (e.which == 13) {
            alert('You pressed enter!');
        }
    });
1
дададзена
Паглядзіце на зыходны пытанне: «На самой справе, Div змяшчае некаторыя ўваходныя/абярыце элементы кіравання, якія выкарыстоўваюцца для фільтрацыі змесціва сеткі»
дададзена аўтар Kamil T, крыніца

Ваша пытанне можа быць больш дакладным - вы хочаце, каб выявіць Keypressed падзеі на ўваход аб'екце ўкладзенага джгутоў пэўнага DIV. Можа быць, вы маглі б паспрабаваць:

$("#myDiv input,select").keypress(function (e) {
        if (e.which == 13) {
            alert('You pressed enter!');
        }
    });
1
дададзена
Паглядзіце на зыходны пытанне: «На самой справе, Div змяшчае некаторыя ўваходныя/абярыце элементы кіравання, якія выкарыстоўваюцца для фільтрацыі змесціва сеткі»
дададзена аўтар Kamil T, крыніца

Вы можаце засяродзіцца на кнопку або тэг прадставіць першую затым націсніце яе

  $('#id of input button').focus();

або

 $('input[type="submit"]').focus();

затым націсніце клавішу Увод

 $("#inputid").keypress(function (e) {
   if (e.which == 13) {
    alert('You pressed enter!');
  }
});
1
дададзена

Вы можаце засяродзіцца на кнопку або тэг прадставіць першую затым націсніце яе

  $('#id of input button').focus();

або

 $('input[type="submit"]').focus();

затым націсніце клавішу Увод

 $("#inputid").keypress(function (e) {
   if (e.which == 13) {
    alert('You pressed enter!');
  }
});
1
дададзена
$("#inputid").keypress(function (e) {
    if (e.which == 13) {
        alert('You pressed enter!');
    }
});

Вы хочаце abind апрацоўшчыка падзеі к/кнопцы канкрэтнага ўводу (напрыклад, нейкі кнопка «фільтр»)

0
дададзена
так, вы маеце рацыю
дададзена аўтар Daniel Ruf, крыніца
Вы Шоул лепш выкарыстоўваць $ ( "# inputid"), а не $ ( "# myDiv #inputid") у гэтым выпадку. Id з'яўляецца унікальным для кожнага элемента на старонцы, няма неабходнасці ўказваць яго бацькі ў селектары.
дададзена аўтар Kamil T, крыніца
$("#inputid").keypress(function (e) {
    if (e.which == 13) {
        alert('You pressed enter!');
    }
});

Вы хочаце abind апрацоўшчыка падзеі к/кнопцы канкрэтнага ўводу (напрыклад, нейкі кнопка «фільтр»)

0
дададзена
так, вы маеце рацыю
дададзена аўтар Daniel Ruf, крыніца
Вы Шоул лепш выкарыстоўваць $ ( "# inputid"), а не $ ( "# myDiv #inputid") у гэтым выпадку. Id з'яўляецца унікальным для кожнага элемента на старонцы, няма неабходнасці ўказваць яго бацькі ў селектары.
дададзена аўтар Kamil T, крыніца

Увядзіце ключ націскаецца ў асноўным для ўводу чагосьці або ўявіць. Ёсць кнопка або тэкставае поле ўнутры DIV, які будзе выдзелены, а затым націсніце клавішу Увод.

0
дададзена

Увядзіце ключ націскаецца ў асноўным для ўводу чагосьці або ўявіць. Ёсць кнопка або тэкставае поле ўнутры DIV, які будзе выдзелены, а затым націсніце клавішу Увод.

0
дададзена

Вы можаце спачатку ўсталяваць фокус на DIV з дапамогай:

window.location.hash = '#name of div';

Пасля гэтага выкарыстоўвайце ваш код будзе працаваць.

0
дададзена

Вы можаце спачатку ўсталяваць фокус на DIV з дапамогай:

window.location.hash = '#name of div';

Пасля гэтага выкарыстоўвайце ваш код будзе працаваць.

0
дададзена