Générez un formulaire Web moderne à l'aide de HTML et de JavaScript.
|
Vous pouvez interroger un modèle directement et tester les résultats renvoyés lors de l'utilisation de différentes valeurs de paramètre en utilisant la console Cloud ou en appelant directement l'API Vertex AI.
|
|||||||||||
Invite forme libre
Generate a web form using HTML and Javascript for customers to express interest
in our product. The form should collect customers' names, email addresses, and
how they found out about us. The form should reflect modern web design trends.
Réponse
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Product Interest Form</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
form {
width: 100%;
max-width: 500px;
margin: 0 auto;
padding: 20px;
border: 1px solid #ccc;
border-radius: 5px;
}
label {
display: block;
margin-bottom: 5px;
}
input,
textarea {
width: 100%;
padding: 5px;
border: 1px solid #ccc;
border-radius: 3px;
}
button {
width: 100%;
padding: 5px;
background-color: #007bff;
color: #fff;
border: none;
border-radius: 3px;
cursor: pointer;
}
</style>
</head>
<body>
<form>
<h1>Express Interest in Our Product</h1>
<p>Please fill out the form below to express your interest in our product. We'll be in touch soon to discuss your needs.</p>
<label for="name">Name:</label>
<input type="text" id="name" required>
<label for="email">Email Address:</label>
<input type="email" id="email" required>
<label for="how-found">How did you find out about us?</label>
<select id="how-found" required>
<option value="">Select an option</option>
<option value="google">Google</option>
<option value="facebook">Facebook</option>
<option value="twitter">Twitter</option>
<option value="other">Other</option>
</select>
<button type="submit">Submit</button>
</form>
<script>
const form = document.querySelector('form');
form.addEventListener('submit', (event) => {
event.preventDefault();
const name = document.querySelector('#name').value;
const email = document.querySelector('#email').value;
const howFound = document.querySelector('#how-found').value;
console.log(`Name: ${name}`);
console.log(`Email: ${email}`);
console.log(`How found: ${howFound}`);
});
</script>
</body>
</html>
```
|
|
||||||||||