Menu
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS CYBERSECURITY DATA SCIENCE
     ❯   

ASP.NET 网页 - HTML 表单


表单是 HTML 文档中的一部分,用于放置输入控件(文本框、复选框、单选按钮和下拉列表)。


创建 HTML 输入页面

Razor 示例

<html>
<body> 
@{
if (IsPost) { 
string companyname = Request["CompanyName"]; 
string contactname = Request["ContactName"]; 
<p>您输入的是:<br />
公司名称:@companyname <br />
联系人姓名:@contactname </p>
}
else
{
<form method="post" action="">
公司名称:<br />
<input type="text" name="CompanyName" value="" /><br />
联系人姓名:<br />
<input type="text" name="ContactName" value="" /><br /><br />
<input type="submit" value="提交" class="submit" />
</form>
}
} 
</body> 
</html>
运行示例 »


Razor 示例 - 显示图像

假设您的图像文件夹中有 3 张图片,您希望根据用户的选择动态显示图片。

这可以通过一些 Razor 代码轻松实现。

如果您的网站的图像文件夹中有一张名为“Photo1.jpg”的图片,您可以使用 HTML <img> 元素这样显示图片

<img src="images/Photo1.jpg" alt="示例" />

以下示例演示如何显示用户从下拉列表中选择的图片: 

Razor 示例

@{
var imagePath="";
if (Request["Choice"] != null)
   {imagePath="images/" + Request["Choice"];}
}
<!DOCTYPE html>
<html>
<body>
<h1>显示图像</h1>
<form method="post" action="">
我想看
<select name="Choice">
  <option value="Photo1.jpg">图片 1</option>
  <option value="Photo2.jpg">图片 2</option>
  <option value="Photo3.jpg">图片 3</option>
</select>
<input type="submit" value="提交" />
@if (imagePath != "")
{
<p>
<img src="@imagePath" alt="示例" />
</p>
}
 
</form>
</body>
</html>
运行示例 »

示例解释

服务器创建了一个名为 imagePath 的变量。

HTML 页面有一个名为 Choice下拉列表(<select> 元素)。它允许用户选择一个友好名称(如 图片 1),并在页面提交到 Web 服务器时传递一个文件名(如 Photo1.jpg)。

Razor 代码通过 Request["Choice"] 读取 Choice 的值。如果它有一个值,代码会构造一个指向图像 images/Photo1.jpg 的路径,并将其存储在变量 imagePath 中。

在 HTML 页面中,有一个 <img> 元素用于显示图像。src 属性在页面显示时设置为 imagePath 变量的值。

<img> 元素在一个 if 块中,以防止尝试显示没有名称的图像(如页面第一次显示时)。


×

Contact Sales

If you want to use W3Schools services as an educational institution, team or enterprise, send us an e-mail:
[email protected]

Report Error

If you want to report an error, or if you want to make a suggestion, send us an e-mail:
[email protected]

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Copyright 1999-2024 by Refsnes Data. All Rights Reserved. W3Schools is Powered by W3.CSS.