Как остановить переключение кнопки в теге div с помощью jQuery? - PullRequest
2 голосов
/ 31 августа 2011

У меня есть ссылка, которая вызывает тэг div для переключения. Проблема в том, что я не хочу, чтобы моя кнопка (которая находится внутри div) переключалась. Как я могу остановить его от переключения?

Это мой HTML-код: -

<a href="#" id="uploadVideoLink" class="menuLink"> Upload Videos </a>
<div id="uploadVideos" class="menu">
  <input name="submit" type="submit" value="Upload" id="btn" />
</div>

Это мой код jQuery: -

$(document).ready(
  function upload(){$("#uploadVideoLink").click(
     function uploadTog(){$("#uploadVideos").toggle();}     
  );}   
);  

Ответы [ 3 ]

1 голос
/ 31 августа 2011

Вы должны получить его за пределами <div>, в котором вы не можете скрыть элемент без всех элементов внутри него. Это просто DOM.

0 голосов
/ 31 августа 2011

Если я правильно понимаю, вам нужно переместить кнопку за пределы div. Приложив немного стилей, вы сможете настроить интерфейс так, чтобы он выглядел правильно.

Либо поместите включенный DIV поверх внешней кнопки, и поместите другую идентичную кнопку внутри DIV поверх исходной кнопки. Или поместите включенный DIV рядом с / чуть ниже кнопки и просто создайте границу, из-за которой кажется, что кнопка теперь является «частью» переключенного DIV.

0 голосов
/ 31 августа 2011

Если вы имеете в виду, что не хотите скрывать кнопку, это невозможно, я думаю, пока кнопка находится внутри div, потому что toggle() присваивает display: none; элементу div, таким образом скрывая все внутри него

Одна вещь, которую вы могли бы сделать, это (это переключило бы все элементы внутри div, но не кнопку):

<a href="#" id="uploadVideoLink" class="menuLink"> Upload Videos </a>
<div id="uploadVideos" class="menu">
    <div>sometext</div>
    <input name="submit" type="submit" value="Upload" id="btn" />
    <div>sometext</div>
</div>

$(document).ready(

function upload() {
    $("#uploadVideoLink").click(

    function uploadTog() {
        $("#uploadVideos *:not(#btn)").toggle();
    });
});

скрипка http://jsfiddle.net/K5NL4/

...