美文网首页
HTML 表单

HTML 表单

作者: 流蓝浅 | 来源:发表于2018-04-17 21:26 被阅读0次
    HTML 表单 - 输入元素

    多数情况下被用到的表单标签是输入标签( <input>)。

    输入类型是由类型属性(type)定义的。大多数经常被用到的输入类型如下:

    1:文本域(Text Fields)

    文本域通过 <input type="text"> 标签来设定,当用户要在表单中键入字母、数字等内容 时,就会用到文本域。

    <form> 
    
    First name: <input type="text" name="firstname"><br> 
    
    Last name: <input type="text" name="lastname"> 
    
    </form> 
    
    

    注意:表单本身并不可见。同时,在大多数浏览器中,文本域的缺省宽度是 20 个字符。

    2: 密码字段

    密码字段通过标签 <input type="password"> 来定义:

    <form> 
    
    Password: <input type="password" name="pwd"> 
    
    </form> 
    
    

    注意:密码字段字符不会明文显示,而是以星号或圆点替代。

    3:单选按钮(Radio Buttons)

    <input type="radio"> 标签定义了表单单选框选项

    <form> 
    
    <input type="radio" name="gender" value="male">Male<br> 
    
    <input type="radio" name="gender" value="female">Female 
    
    </form> 
    
    

    4:复选框(Checkboxes)

    <input type="checkbox"> 定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项。

    form> 
    
    <input type="checkbox" name="vehicle" value="Bike">I have a bike<br> 
    
    <input type="checkbox" name="vehicle" value="Car">I have a car 
    
    </form> 
    

    5: 提交按钮(Submit Button)
    <input type="submit"> 定义了提交按钮.

    当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。:

    <form name="input" action="html_form_action.php" method="get"> 
    
    Username: <input type="text" name="user"> 
    
    <input type="submit" value="Submit"> 
    </form >
    
                                           
    
    

    Forms 表单类

    Form 表单的功能
    1. 自动生成 HTML 表单元素

    2. 检查表单数据的合法性

    3. 如果验证错误,重新显示表单(数据不会重置)

    4. 数据类型转换(字符类型的数据转换成相应的 Python 类型)

    Form 相关的对象包括
    1. Widget :用来渲染成 HTML 元素的工具,如:forms.Textarea 对应 HTML 中的<textarea>标签

    2. Field:Form 对象中的一个字段,如:EmailField 表示 email 字段,如果这个字段不是有效的 email 格式,就会产生错误。

    3. Form:一系列 Field 对象的集合,负责验证和显示 HTML 元素

    4. Form Media:用来渲染表单的 CSS 和 JavaScript 资源。

    继承 Form
    from django import forms 
    
    class AddForm(forms.Form):
      a = forms.IntegerField() 
    
       b = forms.IntegerField() 
    

    我们的视图函数 views.py 中

    # coding:utf-8 
    
    from django.shortcuts import render 
    
    from django.http import HttpResponse 
    
    # 引入我们创建的表单类 
    
    from .forms import AddForm 
    
    def index(request): 
    
       if request.method == 'POST':# 当提交表单时 
    
         form = AddForm(request.POST) # form 包含提交的数据 
    
         if form.is_valid():# 如果提交的数据合法 
    
            a = form.cleaned_data['a'] 
    
            b = form.cleaned_data['b'] 
    
            return HttpResponse(str(int(a) + int(b))) 
    
       else:# 当正常访问时 
    
         form = AddForm() 
    
       return render(request, 'index.html', {'form': form}) 
    

    对应的模板文件 index.html

      <form method='post'> 
    
         {% csrf_token %} 
    
         {{ form }} 
    
          <input type="submit" value="提交"> 
    
          </form> 
    
    再在  urls.py  中对应写上这个函数 
    
           from django.conf.urls import patterns, include, url 
    
           from django.contrib import admin 
    
           admin.autodiscover() 
    
           urlpatterns = patterns('', 
    
             # 注意下面这一行 
    
              url(r'^$', 'tools.views.index', name='home'), 
    
              url(r'^admin/', include(admin.site.urls)), 
    
           ) 
    
    

    相关文章

      网友评论

          本文标题:HTML 表单

          本文链接:https://www.haomeiwen.com/subject/xhzpkftx.html