- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我对 Semantic UI 还很陌生,而且我对 Javascript 有点生疏,所以请耐心等待。我实际上只是复制粘贴了他们网站上的 Semantic UI 示例中的代码,以查看他们的表单验证如何工作,但由于某种原因,它对我不起作用。我可能遗漏了什么吗?
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href = "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.2/semantic.min.css">
<link rel="stylesheet" type="text/css" href = "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.10/components/form.css">
<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"> </script>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.10/semantic.min.js"> </script>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.10/components/form.js"> </script>
</head>
<body>
<script>
$('.ui.form')
.form({
fields: {
name: {
identifier: 'name',
rules: [
{
type : 'empty',
prompt : 'Please enter your name'
}
]
},
skills: {
identifier: 'skills',
rules: [
{
type : 'minCount[2]',
prompt : 'Please select at least two skills'
}
]
},
gender: {
identifier: 'gender',
rules: [
{
type : 'empty',
prompt : 'Please select a gender'
}
]
},
username: {
identifier: 'username',
rules: [
{
type : 'empty',
prompt : 'Please enter a username'
}
]
},
password: {
identifier: 'password',
rules: [
{
type : 'empty',
prompt : 'Please enter a password'
},
{
type : 'minLength[6]',
prompt : 'Your password must be at least {ruleValue} characters'
}
]
},
terms: {
identifier: 'terms',
rules: [
{
type : 'checked',
prompt : 'You must agree to the terms and conditions'
}
]
}
}
})
;
</script>
<form class="ui form segment">
<p>Tell Us About Yourself</p>
<div class="two fields">
<div class="field">
<label>Name</label>
<input placeholder="First Name" name="name" type="text">
</div>
<div class="field">
<label>Gender</label>
<select class="ui dropdown" name="gender">
<option value="">Gender</option>
<option value="male">Male</option>
<option value="female">Female</option>
</select>
</div>
</div>
<div class="two fields">
<div class="field">
<label>Username</label>
<input placeholder="Username" name="username" type="text">
</div>
<div class="field">
<label>Password</label>
<input type="password" name="password">
</div>
</div>
<div class="field">
<label>Skills</label>
<select name="skills" multiple="" class="ui dropdown">
<option value="">Select Skills</option>
<option value="css">CSS</option>
<option value="html">HTML</option>
<option value="javascript">Javascript</option>
<option value="design">Graphic Design</option>
<option value="plumbing">Plumbing</option>
<option value="mech">Mechanical Engineering</option>
<option value="repair">Kitchen Repair</option>
</select>
</div>
<div class="inline field">
<div class="ui checkbox">
<input type="checkbox" name="terms">
<label>I agree to the terms and conditions</label>
</div>
</div>
<div class="ui blue submit button">Submit</div>
<div class="ui error message"></div>
</form>
</body>
</html>
最佳答案
$(document).ready(function(){
// and here your code
});
由于语义需要 jQuery 才能工作,因此您必须在 jQuery 中调用语义 UI 函数。
关于javascript - 语义 UI 表单验证不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43692110/
我正在尝试提升我的 javascript 编程技能(或者说我的编程技能时期 :)) 所以我试图理解一些语义: 第一行的“?”是什么意思?均值和“-distance”中的减号 第二行中的“+=”或“-=
我正在尝试在语义 UI 中执行复选框,但它不起作用,我无法弄清楚我做错了什么。 我包括jquery、semantic.min.js、checkbox.js 和semantic.min.css,然后我添
我正在构建一个 Spring 后端。我有一个 Controller ,它获取一个“搜索对象” - 一个具有 10 个字段的对象,其中只有一个应该被填充,所以搜索功能(我没有编写,但需要对其进行更改和重
我面临着编写更智能/高级的“相关内容”算法的挑战,并且不知道从哪里开始,所以我决定提出一个问题,是否有人会指出我正确的方向。 我们的数据库包含很多文章,到目前为止,我们使用关键字/标签查询了相关文章,
我正在尝试将通用字符串写入Rust中的数字函数,其中支持的类型为i16,i32,i64,u32,u64,f32和f64。 最初我有这个: fn str_to_num(s: &str, default_
假设我们在 hpp 文件中有一个带有唯一指针的简单结构: struct SomeType { SomeType() = default; ~SomeType(); st
这是同一预处理指令的多个问题。 1 - <> 还是 ""? 除了在 MSDN 中找到的信息: #include Directive (C-C++) 1.a:这两种符号有什么区别? 1.b:所有编译器都
所以基本上我有一个带有列表的简单系统,当我选择一个项目时,它会显示描述和绑定(bind)到该项目的图像。 项目:https://jsfiddle.net/jhnjcddh/2/ 问题是我需要在 JS
很抱歉问了一个愚蠢的问题,但有人能告诉我以下是什么意思吗 for ctype, (codename, name) in searched_perms: 我不明白括号里是怎么回事。 for ctype
这个问题在这里已经有了答案: 关闭 11 年前。 Possible Duplicate: Why do all these crazy function pointer definitions al
我正在学习 HTML5,并获得了一个将 CSS Zen Gardens 转换为 HTML5 语义版本的项目。我已经能够轻松地转换其中的大部分内容,但是底部的链接/导航给我带来了一些问题。 转换此/处理
关闭。这个问题是opinion-based .它目前不接受答案。 想要改进这个问题? 更新问题,以便 editing this post 可以用事实和引用来回答它. 关闭 9 年前。 Improv
我一直在我的 emacs c/c++ 开发设置中试验 cedet 和语义,除了一个小细节外,我对它非常满意。 我使用 ede-cpp-root-project 创建一个项目,并给出我的项目的根目录以及
引用问题自http://www.garfieldtech.com/blog/put-up-with-put (这是针对 Drupal 开源项目的,有点元,因为这里没有代码): GET、HEAD 和 P
我有以下代码。 let v_blue = UIView() v_blue.backgroundColor = UIColor.blueColor() l
我目前正在 objc.io 上阅读优秀的 Advanced Swift 书籍,但遇到了一些我不明白的问题。 如果您在操场上运行以下代码,您会注意到在修改字典中包含的结构时,下标访问会生成一个副本,但随
谁能给我一个关于 Flutter 上下文中语义概念的清晰解释(或链接)(它实际上是什么,何时使用,更新...)? 我在谷歌上搜索了很多,但到目前为止还没有找到任何好的解释。 非常感谢, 最佳答案 Di
这是我的代码 Was this what you wanted? It's good to see you again.
我有一个侧边栏,其中包含应用程序的主导航。它还包含一个 button 触发侧边栏的打开/关闭。在语义方面,标记应该是什么样的? 我应该把侧边栏放在一边,然后只在周围设置导航吗主导航,不包括打开/关闭触
考虑下面这行 Lisp 代码: (some-function 7 8 | 9) ;; some comment. note the extra indentation 该点位于“8”和
我是一名优秀的程序员,十分优秀!