Czy kodowanie w języku HTML może coś zrobić bez JavaScriptu?

Question

Mam stronę internetową, która ma przycisk. Obecnie wiążę ten przycisk z obsługą javascript, która sprawia, że ​​strona jest przekierowywana do danego adresu URL po kliknięciu.

HTML:

<button class="click-me">Clike me to navigate</button> 

JS:

$('.click-me').on('click', function() { window.location = '/myloc'; }); 

Jestem teraz próbuje zbudować fallback (bez javascript) wersja tej strony. Chciałbym, aby ten przycisk wykonywał tę samą pracę, ale bez używania javascript. Innymi słowy, próbuję uczynić ten przycisk funkcjonalnym, nawet jeśli javascript przeglądarki jest wyłączony.

Wiem, że można to osiągnąć za pomocą formularza (jak pokazano poniżej). Ale szukam jakiejkolwiek czystszej implementacji.

<form name="hack" action="/myloc"> 
    <button type="submit" class="click-me">Click me to navigate</button> 
</form> 

Answer 1

Użyj element a, to co oni dla:

<a class="click-me" href="/path/to/whatever/page">Click me to navigate</a> 

a następnie po prostu styl go jako button.

Na przykład z następującym CSS:

.clickMe { 
    -moz-appearance: button; 
    -ms-appearance: button; 
    -o-appearance: button; 
    -webkit-appearance: button; 
    appearance: button; 
    text-decoration: none; 
    color: #000; 
    padding: 0.2em 0.4em; 
}​ 

JS Fiddle demo.

(Oczywiście ten zakłada wykorzystanie przeglądarki, która obsługuje appearance (lub wersje sprzedawca-prefiksem) właściwości CSS).

Referencje:

• appearance (albeit it's the -moz- prefixed MDN documentation).
• appearance property, at the W3C.
• Unfortunately-dropped CSS3 features (at the W3C).

Answer 2

Aby odpowiedzieć na pytanie zadane w nagłówku, tak, button element może "robić rzeczy" bez JavaScript. Z numerem type=submit przesyła formularz, jak w przykładzie na końcu pytania. Dzięki type=reset, usuwa on wszystkie dane wprowadzone przez użytkownika z formularza. Jest to tylko type=button (domyślnie, gdy element jest poza jakąkolwiek formą), która jest zależna od JavaScriptu i nie robi nic bez skryptów.

Aby odpowiedzieć na pytanie, które powinieneś zadać: Użyj linków, Luke. Jeśli chcesz, możesz nadać stylowi link podobny do przycisku (może to mieć sens w kontekście aplikacji), nawet przy użyciu tylko CSS 2.1 i opcjonalnych rozszerzeń CSS3, takich jak zaokrąglone rogi.

Answer 3

można po prostu dodać realizację kliknięcia przycisku (jeśli odwołuje dowolną stronę internetową), dodając tag przed it..For przykład:

<a href="https://www.youtube.com/"> 
<button>Youtube</button> 
</a> 

To doesnot potrzebujesz o ile mi znać żadnego języka JavaScript.