2016-08-01 5 views
1

У меня есть элемент управления, вложенный внутри ячейки таблицы. Строка таблицы, содержащая ячейку таблицы, имеет событие onclick. Когда я нажимаю на элемент управления select, чтобы изменить значение, событие onclick строки запускается. Ive попытался использовать метод stoppropagation для события onchange, но он, похоже, не работает. Есть идеи? Ниже мой кодОтмена распространения события onchange выбранного элемента управления

xxxxxxx.Helper.DDGoto = function (o, e) { 
    e.stopPropagation(); 
    var path = $(o).val(); 

    if (path != null) { 
     this.Goto(path); 
    } 
} 



    <tr onclick="somemethod()"> 
    <td>some text</td> 
    <td> 
     <select onchange="xxxxxxx.Helper.DDGoto(this, event)">some options</select> 
    </td> 
</tr> 
+0

Ваш 'xxxxxxx.Helper.DDGoto' не запускается' click', а 'change'. Таким образом, 'e.stopPropagation();' inside никогда не выполняется! – cFreed

+0

Добавьте '$ ('select'). On ('click', function (e) {e.stopPropagation();})' и он работает –

+0

Это потому, что onchange и click не являются тем же типом событий? –

ответ

0

Событие срабатывает с onchange события на вашем select не обжиг onclick события на вашем tr, они не имеют такое же типа. Это два разных события. Вот почему прекращение распространения события onchange не останавливает событие onclick, которое должно быть запущено.

Вы должны вместо этого в чеке onclick обработчика, если select элемент была нажата или нет:

somemethod = function (event) { 
    if (event.target.nodeName === 'SELECT') { 
    // The select was clicked, stopping... 
    return; 
    } 

    // The select was not clicked, go ahead... 
} 

Чтобы получить событие в обработчике, то необходимо изменить декларацию:

<tr onclick="somemethod(event)"> 

Я использовал свойство nodeName для примера, но вы также можете использовать свойство цели или какой-либо другой способ определить, был ли выбран щелчок или нет.

Для примера можно указать this fiddle.