我正在尝试使用表单方法checkValidity（）。
[http://html5test.com/]告诉我，我的浏览器（Chrome）支持表单级的checkValidity方法。
但是，使用jsfiddle [http://jsfiddle.net/LcgnQ/2/]我尝试了以下html和javascript代码段：
<form id="profileform" name="profileform">
<input type="text" id="firstname" required>
<input type="button" id="testbutton" value="Test">
</form>
$('#testbutton').bind('click',function(){
try{
alert($('#profileform').checkValidity());
}
catch(err){alert('err='+err)};
});
我收到一个错误：object has no method checkValidity()
我究竟做错了什么？
谢谢。
这是HTML代码：
<!DOCTYPE html><html xmlns='http://www.w3.org/1999/xhtml' >
<head>
<title>HTML Form Builder</title>
<link href='css/font1.css' rel='stylesheet' type='text/css'>
<link href='css/font2.css' rel='stylesheet' type='text/css'>
<link rel='stylesheet' href='css/style.min.css' type='text/css' media='all' />
<link rel='stylesheet' href='css/form.min.css' type='text/css' media='all' />
<link rel='stylesheet' href='css/style1.css' type='text/css' media='all' id='css-theme'/>
<link type='text/css' href='css/redmond/jquery-ui-1.8.23.custom.css' rel='stylesheet' />
<link rel='stylesheet' href='css/tipsy.css' type='text/css' media='all' />
<script type='text/javascript' src='js/jquery-1.8.0.min.js'></script>
<script type='text/javascript' src='js/jquery-ui-1.8.23.custom.min.js'></script>
<script type='text/javascript' src='js/jquery.metadata.js'></script>
<script type='text/javascript' src='js/jquery.validate.js'></script>
<script type='text/javascript' src='js/jquery.tipsy.js'></script>
<script type='text/javascript' src='js/jquery.json-2.3.min.js'></script>
<script type='text/javascript' src='js/main.min.js'></script>
<script type='text/javascript'>
$(function(){
changeInnerHTML('doctor_id');
changeInnerHTML('hospital_id');
changeInnerHTML('clinic_id');
changeInnerHTML('stockist_id');
changeInnerHTML('chemist_id');
changeInnerHTML('bloodbank_id');
changeInnerHTML('dialysis_id');
});
function changeInnerHTML(id)
{
if($('#dialog_box_'+id).length)
{
var tmp=id.split('_');
$.get('getDataValues.php?ref='+tmp[0],function(data,status){
$('#dialog_box_'+id).html(data);
});
}
}
</script>
</head>
<body>
<div id='container'>
<h1 id="form-name" style="background-color: rgb(255, 255, 255); box-shadow: none; border: none; margin: 8px 15px;">New Form</h1>
<form method="POST" id="preview_form" novalidate="novalidate">
<div class="row" style="display: block;"><label class="field" for="textarea_1">textarea_1</label><span class="textArea" data=""><textarea id="dialog_box_textarea_1" name="textarea_1" data="{"validate":{"required":false,"messages":{}}}"></textarea></span></div><div class="row" style="display: block;"><label class="field" for="radiobutton_1">radiobutton_1</label><span class="radioButton" data="" id="radiobutton_1"><label class="option" for="radiobutton_1_option_1"><input class="radio" id="dialog_box_radiobutton_1_option_1" type="radio" name="radiobutton_1" value="Option 1" data="{"validate":{"required":false,"messages":{}}}">Option 1</label><label class="option" for="radiobutton_1_option_2"><input class="radio" id="radiobutton_1_option_2" type="radio" name="radiobutton_1" value="Option 2">Option 2</label><label class="option" for="radiobutton_1_option_3"><input class="radio" id="radiobutton_1_option_3" type="radio" name="radiobutton_1" value="Option 3">Option 3</label></span></div><div class="row" style="display: block;"><label class="field" for="checkboxgroup_1">checkboxgroup_1</label><span class="checkBoxGroup" data="" id="checkboxgroup_1"><label class="option" for="checkboxgroup_1_option_1"><input type="checkbox" class="checkbox" name="checkboxgroup_1[]" id="dialog_box_checkboxgroup_1_option_1" value="Option 1" data="{"validate":{"required":false,"messages":{}}}">Option 1</label><label class="option" for="checkboxgroup_1_option_2"><input type="checkbox" class="checkbox" name="checkboxgroup_1[]" id="checkboxgroup_1_option_2" value="Option 2">Option 2</label><label class="option" for="checkboxgroup_1_option_3"><input type="checkbox" class="checkbox" name="checkboxgroup_1[]" id="checkboxgroup_1_option_3" value="Option 3">Option 3</label></span></div><div class="row" style="display: block;"><label class="field" for="dropdown_1">dropdown_1</label><span class="dropDown" data=""><select id="dialog_box_dropdown_1" name="dropdown_1" data="{"validate":{"required":false,"messages":{}}}"><option value="Option 1">Option 1</option><option value="Option 2">Option 2</option><option value="Option 3">Option 3</option></select></span></div><input type="button" class="button blue" value="Submit" id="submit-form"><input type='hidden' id='tname' name='tname' value='surveyForm_2' /></form></div> <!--container-->
<script type='text/javascript' src='js/form.min.js'></script>
</body>
</html>
这里的代码将获取所有表单字段值：
$("#hidAll").append($("#preview_form :input").map(function () {
if ($(this).val() != 'Submit') {
if ($(this).is('select')) {
var aa = $(this).children('option').map(function () {
return $(this).val();
}).get().join("|");
return $(this).attr('name') + '|' + aa;
} else if ($(this).is('input:checkbox')) {
return $(this).attr('name').substring(0, $(this).attr('name').length - 2) + '|' + $(this).val();
} else {
return $(this).attr('name') + '|' + $(this).val();
}
}
}).get().join(","));
alert($("#hidAll").html());
由此我得到的输出值如下：
textfield_1|dgdfg,
checkboxgroup_1|Option 1,
checkboxgroup_1|Option 2,
checkboxgroup_1|Option 3,
radiobutton_1|Option 1,
radiobutton_1|Option 2,
radiobutton_1|Option 3,
dropdown_1|Option 1!Option 2!Option 3
我想要出如下：
textfield_1|dgdfg,
checkboxgroup_1|Option 1!Option 2!Option 3,
radiobutton_1|Option 1!Option 2!Option 3,
dropdown_1|Option 1!Option 2!Option 3
我有一个列表，我想在列表文本之前添加刻度符号。 是否有任何CSS可以帮助我以这种方式应用？
✓ this is my text
✓ this is my text
✓ this is my text
✓ this is my text
✓ this is my text
✓ this is my text
注意：我需要这种类型的HTML代码
<ul>
<li>this is my text</li>
<li>this is my text</li>
<li>this is my text</li>
<li>this is my text</li>
<li>this is my text</li>
</ul>当像hidden属性这样的属性是boolean属性时，这意味着什么？ 有人可以用外行的术语解释吗？
如果输入不是有效数字，则使用type=number将导致事件侦听器内部的this.value = this.value.replace(/[^0-9.]/g, "")返回空字符串。 您可以在[http://jsfiddle.net/fSy53/]上看到一个示例。
但是，无效字符仍显示在输入中。
有什么方法可以从事件侦听器中获取实际显示的值，包括无效字符？
我的最终目标是防止用户在字段中实际键入任何非数字字符。 我需要使用type=number，以便移动设备使用数字虚拟键盘。 我的目标是在keyup keypress上执行类似this.value = this.value.replace(/[^0-9.]/g, "")的操作，但这不起作用，因为如果键入了无效字符，则从this.value读取将返回""。
我正在尝试在我的网站上获得一个SVG Favicon，但是无论我做什么，它都不想工作。
我将以下代码另存为.svg文件，保存在我的常用图标位置中，但是当我将图标图标路径更改为.svg而不是.ico时，则不会加载任何内容。
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 384.5 283.4" style="enable-background:new 0 0 384.5 283.4;" xml:space="preserve" width="100%" height="100%">
<style type="text/css">
.shape1 {fill: #DB6B2A;}
.shape2 {fill: #AE1A31;}
</style>
<path class="shape1" d="M384.5,83.7c-4.6-19.3-14.3-36.3-29.3-51.3C333.4,10.6,307.6,0,276.7,0c-30.9,0-56.7,10.6-78.4,32.4
l-4.6,5.1l-4.5-5.1C167.4,10.6,141.6,0,110.8,0S54.1,10.6,32.4,32.4C10.6,54.1,0,79.9,0,110.8v61.1l55.1-12.8v-48.4
c0-15.2,5.6-28.3,16.2-39C82,60.7,95.1,55.1,110.8,55.1c30.4,0,55.1,25.3,55.1,55.6v22.9l55.6-12.7v-10.1c0-2.5,0-4.6-0.5-7.1
c1.5-12.1,7.1-22.8,16.2-31.9c10.6-11.1,23.8-16.7,39.5-16.7c25.4,0,46.9,17.2,53.3,40.7"/>
<path class="shape2" d="M54.5,187.6c6.4,23.5,27.9,40.7,53.3,40.7c15.7,0,28.8-5.6,39.5-16.7c9.1-9.1,14.7-19.7,16.2-31.9
c-0.5-2.5-0.5-4.6-0.5-7.1v-10.1l55.6-12.7v22.9c0,30.4,24.8,55.6,55.1,55.6c15.7,0,28.8-5.6,39.5-16.7
c10.6-10.6,16.2-23.8,16.2-38.9v-48.4l55.1-12.7v61.1c0,30.9-10.6,56.7-32.4,78.4c-21.7,21.7-47.5,32.4-78.4,32.4
c-30.9,0-56.7-10.6-78.4-32.4l-4.6-5.1l-4.6,5.1c-21.7,21.7-47.6,32.4-78.4,32.4s-56.7-10.6-78.4-32.4C14.3,236,4.6,219,0,199.7"/>
</svg>
这是我用来设置收藏夹图标的代码；
<link rel="icon" href="http://www.MYSITE.co.uk/favicon.svg?v=4">
如果我的.svg代码有问题，或者缺少某些内容，我无法解决。谢谢
我希望能够按原样获取我的DOM，并将其转换为字符串。 假设我打开检查器并更改了特定元素的margin-left属性。 该更改应反映在我的字符串中。
该函数应正确采用当前应用于元素的所有样式（不包括默认值），并将其包括在该元素的内联样式中。
我写了一个“解决方案”，事实证明这是不够的。 Webkit中的getMatchedCSSRules功能极为复杂，我无法确定为什么有时可以正常工作，而在其他时候却无法工作。 因此，我想避免使用此功能，除非它在100％的时间内都有效。 同样，getComputedStyle函数也有其自身的问题。 如果使用检查器将此页面上的#footer元素更改为7px solid red而不是7px solid black，则更改将反映在我在控制台中运行getComputedStyle(document.getElementById('footer')).cssText时，但它也会为我提供许多从未被修改的继承属性。 用户使用检查器或页面上的样式表。
我正在寻找一种适用于webkit的解决方案-跨浏览器兼容性目前不是问题。
谢谢！
可能重复：
使用JavaScript从多文件上传控件中检索文件名
在HTML5输入中，type =“ file”允许用户通过添加multiple =“ multiple”来选择多个文件：
<input type="file" multiple="multiple" />
我的问题是：如何获得该输入的价值？ 使用.value时，它仅返回选择的第一个文件的文件名，但是选择多个文件时，我将无法查看其他文件。
我有的：
<input type="file" multiple="multiple" onchange="alert(this.value)"
onmouseout="alert(this.value) />
正如我告诉您的那样，它仅显示所选文件之一的名称。
注意：我不想编辑值（我知道这是不可能的），只能编辑文件名
谢谢！
我有一个奇怪的问题。 我尝试创建一个带有循环背景视频的网站。 代码如下所示：
<video src="video/bg.mp4" style="z-index: -1;object-fit: cover;" poster="video/bg.jpg" autobuffer autoplay loop muted></video>这在大多数浏览器上都可以正常工作（IE很难解决这种适合对象的事情，但是我不介意），但是在iPhone上视频无法自动播放，而在iPad上可以。 我已经阅读了iOS的新政策，并且认为符合要求（否则iPad无法自动播放）。 我做了其他测试：
我做错了吗，还是iPhone不会自动播放视频并始终需要交互？ 我只关心iOS 10，我知道iOS 9的要求有所不同
如何隐藏chart.js中显示的x轴标签/文本？
设置scaleShowLabels:false仅删除y轴标签。
<script>
var options = {
scaleFontColor: "#fa0",
datasetStrokeWidth: 1,
scaleShowLabels : false,
animation : false,
bezierCurve : true,
scaleStartValue: 0,
};
var lineChartData = {
labels : ["1","2","3","4","5","6","7"],
datasets : [
{
fillColor : "rgba(151,187,205,0.5)",
strokeColor : "rgba(151,187,205,1)",
pointColor : "rgba(151,187,205,1)",
pointStrokeColor : "#fff",
data : [1,3,0,0,6,2,10]
}
]
}
var myLine = new Chart(document.getElementById("canvas").getContext("2d")).Line(lineChartData,options);
</script>
如果用户的浏览器支持，我想在代码中使用HTML5 "placeholder"属性，否则只需在表单顶部打印字段名称。 但是我只想检查是否支持占位符，而不要检查用户使用的浏览器版本/名称。
所以理想情况下，我想做类似的事情
<body>
<script>
if (placeholderIsNotSupported) {
<b>Username</b>;
}
</script>
<input type = "text" placeholder ="Username">
</body>
除了我不确定JavaScript的位。 感谢帮助！
我的网站上有此代码
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"/>
<script type='text/javascript' src='/lib/player/swfobject.js'></script>
swfobject不起作用（未加载）。
将代码更改为：
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
<script type='text/javascript' src='/lib/player/swfobject.js'></script>
工作正常。
该文档被解析为HTML5。
我觉得很好笑。 好的，授予已关闭的标签和自动关闭的标签是不同的。 因此，我将了解jQuery是否无法加载（尽管我觉得这很可笑）。
但是我不明白是jQuery加载了，但是以下正确编写的标记不是吗？
我当前正在使用“缓存清单”（如此处所述）。 当用户离线时，这有效地使运行应用程序所需的资源可用。
不幸的是，它工作得太好了。
加载缓存清单后，Firefox 3.5+会缓存在缓存清单中显式引用的所有资源。 但是，如果服务器上的文件已更新，并且用户在联机时尝试强制刷新页面（包括缓存清单本身），则Firefox将绝对拒绝获取任何内容。 该应用程序在缓存的最后一点保持完全冻结。 问题：
使用fetch()，可以请求从服务器而不是从浏览器缓存中获取文件？
换句话说，使用fetch()，是否有可能绕过浏览器的缓存？
我想有一个可以在列中伸展的表，但是我在使用CSS的最小和最大宽度时遇到了一些麻烦。
似乎也有一些相互矛盾的答案，关于这是如何工作的：
我想要以下
table{
width:100%;
}
.a, .b, .c
{
background-color: red;
}
.a
{
min-width: 10px;
max-width: 20px;
}
.b
{
min-width: 40px;
max-width: 45px;
}
.c
{
}
<table>
<tr>
<td class="a">A</td>
<td class="b">B</td>
<td class="c">C</td>
</tr>
</table>
有没有一种方法可以在没有javascript的情况下实现此目标（即，用表约束列的拉伸）？
下表是一些不同的CSS设置实际呈现的内容的表：
如何使用HTML5 canvas标记页面，以使div
占宽度的80％
具有有效定义比例的相应像素高度和宽度（并在画布拉伸到80％时按比例保持）
垂直和水平居中
您可以假定canvas是页面上唯一的东西，但是如有必要，可以将其封装在divs中。
我正在寻找一个DOM事件，该事件可以通过JavaScript侦听，方法是先单击页面上其他位置的select元素，然后关闭已打开（但未更改任何选项）的select元素。
这不是select的change事件，因为select保留了焦点。 同样，这不是其他元素或文档的focus事件，也不是窗口，文档或主体上的mousedown或click事件。
这不是选择事件change，因为选择中的任何选项都没有更改。
我不关心旧版Internet Explorer，而只是在符合标准的现代浏览器中可以使用的东西。 专有的黑客可能值得一提。
我创建了一个JSFiddle来演示该问题：[http://jsfiddle.net/premasagar/FpfnM/]
所以问题是：单击选择框时，可以添加什么JavaScript来记录事件？
（我在这里提出了类似但不同的问题：
iOS上的JavaScript：打开HTML选择元素）
我目前正在使用[http://paperjs.org]创建HTML5画布绘图应用程序。 我想让用户将图像上传到画布中。 我知道我需要进行登录和注册，但是有更简单的方法吗？ 我已经看到HTML5拖放上传。
每当在Chrome中触摸应用了cursor：pointer属性的Div时，就会出现一个蓝色突出显示。我们如何摆脱它？
我尝试了以下方法：
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
但是它们不会影响按光标时的蓝色突出显示。