freeCodeCamp

2.5 KiB

Raw Blame History

id	title	challengeType	videoUrl	localeTitle
bad87fee1348bd9aede08830	Create a Form Element	0		Crie um elemento de formulário

Descrição

Você pode criar formulários da Web que realmente enviam dados para um servidor usando nada além de HTML puro. Você pode fazer isso especificando uma ação action no seu elemento de form. O valor definido como ação é o endereço que aponta para algum recurso do seu servidor, onde pode conter códigos de linguagens back-end como PHP, Java, Python e etc. Um exemplo de uso: <form action="/url-where-you-want-to-submit-form-data"></form>

Instruções

Aninhe seu campo de texto dentro de um elemento de form e adicione o atributo action="/submit-cat-photo" ao elemento form.

Tests

tests:
  - text: Aninhe seu elemento de entrada de texto em um elemento de <code>form</code> .
    testString: 'assert($("form") && $("form").children("input") && $("form").children("input").length > 0, "Nest your text input element within a <code>form</code> element.");'
  - text: Certifique-se de que seu <code>form</code> tenha um atributo de <code>action</code> definido como <code>/submit-cat-photo</code>
    testString: 'assert($("form").attr("action") === "/submit-cat-photo", "Make sure your <code>form</code> has an <code>action</code> attribute which is set to <code>/submit-cat-photo</code>");'
  - text: Certifique-se de que seu elemento de <code>form</code> tenha tags de abertura e fechamento bem formadas.
    testString: 'assert(code.match(/<\/form>/g) && code.match(/<form [^<]*>/g) && code.match(/<\/form>/g).length === code.match(/<form [^<]*>/g).length, "Make sure your <code>form</code> element has well-formed open and close tags.");'

Desafio semente

<h2>CatPhotoApp</h2>
<main>
  <p>Click here to view more <a href="#">cat photos</a>.</p>

  <a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>

  <p>Things cats love:</p>
  <ul>
    <li>cat nip</li>
    <li>laser pointers</li>
    <li>lasagna</li>
  </ul>
  <p>Top 3 things cats hate:</p>
  <ol>
    <li>flea treatment</li>
    <li>thunder</li>
    <li>other cats</li>
  </ol>
  <input type="text" placeholder="cat photo URL">
</main>

Solução

// Solução necessária

2.5 KiB Raw Blame History