Jump to content
  • 0

Как использовать button


Zverushka
 Share

Question

Подскажите, как и где использовать button?

Этот тег у меня нигде не применяется. Если нужно отправить форму - то это Input type='submit', если это просто кнопка с действием, н-р, в виде поп-апа, то <div class="btn-blue">. Наверное стоит кнопки не формы заменить на button? <button class="btn-red"> вот так?

Если не удается создать нужно оформление тегу <input type="submit"> из-за одиночности тега, то не label лепить, а <button type="submit">?

Кстати в ие7 не поддерживается? html5div случайно не включает его поддержку?

button type=button - по умолчанию стоит и можно никогда не писать?

Edited by Zverushka
Link to comment
Share on other sites

9 answers to this question

Recommended Posts

  • 0

А в слайдерах везде <a href> суют - нафига спрашивается? При этом свой класс для кнопки задаешь, а они еще и туда ссылку свою генерят, которая еще и не кликается в итоге - приходится еще и ей доп стиль задавать.

Link to comment
Share on other sites

  • 0
по умолчанию submit

А если кнопка не в форме и не менять ее тип - ничего страшного не будет?

так и есть. вне form работает как type='button'

и по поводу IE7 - в нем и более ранних версиях IE не поддерживается атрибут value.

Link to comment
Share on other sites

  • 0

А button нужно value? зачем?.... Текст внутри тега ведь и есть значение...

а если нужно вот так? )))


<button value="1">
<table>
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>4</td><td>5</td><td>6</td></tr>
<tr><td>7</td><td>8</td><td>9</td></tr>
</table>
</button>

или совсем просто, вот так:


<button value="1">Согласен</button>

Edited by wwt
Link to comment
Share on other sites

  • 0

в IE7- с баттонами было несколько багов: во-первых, при наличии в форме нескольких кнопок, при сабмите отсылалось не value нажатой, а innerHTML всех (делая невозможным определение, какая кнопка была нажата, на сервере). Во-вторых, по умолчанию у кнопки был тип button, а не submit, как по стандарту HTML 4+.

В-третьих, с кнопками во всех браузерах есть проблемы с оформлением. У кнопки по умолчанию display:inline-block, и во многих браузерах его не изменить вообще (напр. display:table-cell для кнопок игнорируется). В Фоксах у кнопки по умолчанию лишних 3px паддинга (лечится его обнулением для ::-moz-focus-inner). Из-за этих проблем кнопками пользуются намного реже, чем следовало бы. Потому что идейно и с точки зрения юзабилити (управление с клавиатуры и т.п.) для абстрактных активных элементов ничего лучше нет.

  • Like 1
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Similar Content

    • By Alex777-777
      Все привет.
      Использую bootstrap 3, хотя это наверно и не существенно. Необходимо сделать, чтобы у активных кнопок внизу был указатель, как на картинке. Кнопка любого цвета с любой границей, с иконками и текстом. Но проблема именно с треугольником внизу у активной кнопки.

      Не знаю, как к этому подступиться. Толкните в нужном направлении, спасибо.
       
    • By Progrmergr
      <button class="but" onclick="tap">Пельмени</button> Как я могу в JS получить слово "Пельмени"?
    • By Bourdun
      Появился вопрос на который я так и не смог найти ответа. Нужно создать регистрацию и авторизацию с базой данных и я не понимаю как подключить php файл к html? В остальном попытаюсь разобраться сам
    • By VolKTieR
      Здравствуйте.
      Имеется данный код:
      <audio id="audio">     <source src="audio/1.mp3" type="audio/mpeg"> </audio> <div class="fixedbut" id="sebut">Звук</div> <style> div.fixedbut { position: fixed;     bottom: 93%;     right: 20px;      display: block;      background: white;      border-radius: 10px;     color: black;      text-decoration: none;      padding: 6px 23px;     font-size: 17px ;     -webkit-transition: 0.33s all ease-out;      -o-transition: 0.33s all ease-out;      transition: 0.33s all ease-out;     z-index: 999; } div.fixedbut:hover {         background: grey;         color: white; } </style> <script> document.getElementById("sebut").onclick = function()     {       var myaudio = document.getElementById("audio");       if(myaudio.paused == true)       {         document.getElementById("audio").play();  }       else if (myaudio.paused == false)       {         document.getElementById("audio").pause(); }     } </script> <script>     $(document).ready(function(){       $(window).scroll(function () {         if ($(this).scrollTop() > 200)          {             $('div.fixedbut').fadeIn();        }         else          {             $('div.fixedbut').fadeOut();         }   })     }); </script>
       
      Кнопка плавающая, останавливает звук включенный другой .
      Со звуком проблем нет, но появление и исчезание кнопки при прокрутке не работает.
      Подскажите пожалуйста как сделать))
    • By zexerevev
      Добрый день народ
      У меня есть JS код для веб-картографии который делает отображение на карте двоих шаров и свайп между ними
      В html коде вызывается этот JS код такими командами
      var ctrl = new ol.control.Swipe(); map.addControl(ctrl); // Set stamen on left ctrl.addLayer(osm, true); // OSM on right ctrl.addLayer(stamen); Как эти параметры передать на кнопку, что бы onclick включать и выключать данную функцию
      Если возможно какие то ссылки на дополнительную информацию по этому, так как придется много делать кнопок под разные функции
      Спасибо за понимает с Frontendom еще знаком не близко
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy