66

Вопрос по html5, twitter-bootstrap, css – Как сделать строки таблицы начальной загрузки кликабельными? [Дубликат]

This question already has an answer here:

Я могу взломать это сам, но я думаю, что у начальной загрузки есть эта возможность.

  • Если вы хотите связать событие click только со строками тела таблицы, используйте & apos; .table & gt; tbody & gt; TR & APOS; селектор.

    от
  • блестящее решение, спасибо

    от
  • хороший ответ работать как шарм!

    от
  • Да, но угадайте что? Мне не нужно загружать другой громоздкий плагин JS или выполнять проверку атрибутов внутри обратного вызова jquery.

    от
  • Потрясающие! Это отлично сработало для меня с модальностями.

    от
  • -1 Такой подход довольно старый и не самый лучший. Javastript должен быть ненавязчивым, что не должно смешиваться с html.

    от
  • Кажется, что принятый ответ является более простым, так как большинство проектов уже используют jQuery. Зачем удваивать голоса здесь? Без обид, просто пытаюсь понять, почему это решение лучше?

    от
  • хорошая работа с вашей вилкой. Пожалуйста, настройте пример использования twitter-bootstrap и вашей версии начальной загрузки для этого вопроса.

    от
  • @buffer Небольшой плагин также обрабатывает нажатие ссылки и стилизацию строки, чтобы было понятно, что она работает как ссылка. Конечно, это тривиальная вещь, которую многие разработчики могут легко создать сами. То же самое можно сказать о плагинах Bootstrap's Collapse и Button.

    от
  • @ Jasny-ArnoldDaniels - ваш пример наjasny.github.io/bootstrap/javascript/#rowlink кликабельна только первая колонка с помощью Chrome ... не работает

    от
  • Включите обаbootstrap.css а такжеjasny-bootstrap.css и загрузитьjasny-bootstrap.js, Для использования rowlink см.jasny.github.io/bootstrap/javascript/#rowlink

    от
  • @MuneemHabib просто добавьте идентификатор в эту таблицу и используйте селектор идентификатора$('#my_id > tbody > tr')

    от
  • Как это сделать с конкретной таблицей? Как у меня есть 3 таблицы, и я хочу связать событие клика в одной строке таблицы, как мне это сделать?

    от
  • @MaHo Может быть, вы можете определить почему?

    от
  • использование.on('click', function(){});  вместо.click

    от
  • Да, но угадайте что? Мне не нужно загружать другой громоздкий плагин JS или выполнять проверку атрибутов внутри обратного вызова jquery.

    от
  • -1 Такой подход довольно старый и не самый лучший. Javastript должен быть ненавязчивым, что не должно смешиваться с html.

    от
  • Потрясающие! Это отлично сработало для меня с модальностями.

    от
  • Они уже кликабельны. Вы хотели, чтобы ониdo что-то при нажатии? Если да, то?

    от ceejayoz
7 ответов
  • 4

    Code:

    <tr height="70" onclick="location.href='<%=site_adres2 & urun_adres%>'"
        style="cursor:pointer;">
    

  • 6

    I show you my example with modal windows...you create your modal and g

    ive it an id then In your table you have tr section, just ad the first line you see below (don't forget to set the on the first row like this

    <tr onclick="input" data-toggle="modal" href="#the name for my modal windows" >
     <td><label>Some value here</label></td>
    </tr>                                                                                                                                                                                   
    

  • 22

    Этот код преобразует любую строку таблицы начальной загрузки

    которая имеетdata-href атрибут, установленный в интерактивный элемент

    Замечания:data-href Атрибут является действительнымtr атрибут (HTML5),href атрибуты на элементе tr не являются.

    $(function(){
        $('.table tr[data-href]').each(function(){
            $(this).css('cursor','pointer').hover(
                function(){ 
                    $(this).addClass('active'); 
                },  
                function(){ 
                    $(this).removeClass('active'); 
                }).click( function(){ 
                    document.location = $(this).attr('data-href'); 
                }
            );
        });
    });
    

  • 67

    Использование jQuery довольно тривиально. v2.0 использует

    table класс на всех столах.

    $('.table > tbody > tr').click(function() {
        // row was clicked
    });
    

  • 0

    Может быть, вы пытаетесь прикрепить функцию при щелчке строк таблицы.

    var table = document.getElementById("tableId");
    var rows = table.getElementsByTagName("tr");
    for (i = 0; i < rows.length; i++) {
        rows[i].onclick = functioname(); //call the function like this
    }
    

  • 0

    Вы можете использовать этот способ с помощью начальной загрузки CSS. П

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

        $(".table tr").each(function () {
            $(this).attr("class", "");
        });
        $(this).attr("class", "active");
    

  • 57

    Eсть

    плагин javascript это добавляет эту функцию к начальной загрузке.

    когдаrowlink.js В комплекте вы можете сделать:

    <table data-link="row">
      <tr><td><a href="foo.html">Foo</a></td><td>This is Foo</td></tr>
      <tr><td><a href="bar.html">Bar</a></td><td>Bar is good</td></tr>
    </table>
    

    Таблица будет преобразована таким образом, чтобы можно было щелкнуть всю строку, а не только первый столбец.