‘壹’ 为什么有些前端一直用div当按钮,而不是用button
w3c标准其实有时候挺坑的,为了这个标准,这不能用,那不能用。
还有就是各种标签眼花缭乱,反正多而砸,很多标签可以相互替代。在一定程度上对开发者不友好,增加学习成本。
虽然标准统一是好事,但是太标准也,有时也是一件麻烦事。
比如button,就是按钮,绑定事件的。可是呢现在看来样式太丑,你要美化它,还得去边框等等。还有就是button,你嵌套一张图进去,然后添加事件。先不说是否符合标准,一看就觉得别扭,不是button该干的事。
所以使用button在当下不方便,反正事件大多元素都可以加,而且比button好用。
所以用p模拟也是可以的
因为button按钮的样式一般不符合ui需求。需要重写或覆盖原有样式比较麻烦。
其实按正常来说是应该用button来写按钮,但实际开发过程中每个人的喜好不同,再加上在代码规范上也没有那么多的条条框框,所以就用p来写按钮也是ok的。
在很多人的开发习惯中,块级元素都可用p来实现,行内元素都可用span来实现,毕竟除了特定的标签之外通过css+js都可以实现同样的功能。
其实开发人员不用纠结是用那些标签去实现功能,包括在定义class名的时候也是千奇百怪,我们做不到让每个人都共用一套模式,对于自己而言不管是怎么写的,最后保证不报错并且兼容主流浏览器这就够了。
现在越来越多的前端框架层出不穷,来我公司面试的前端人员甚至只会通过框架去做项目,连最基本的html+css+js基础都不牢固,在实现一些网页特效上显得一头雾水,不是我说掌握更多的主流框架不好,而是在不断学习框架的前提下应该把基本功掌握牢固,当然这也是和当前的培训机构有关系,很多的培训机构都是为了让学员能够最快的去找到工作而忽略了基础知识。
当下前端也在不断地扩宽自己的行业领域,除了vue、小程序之外,有的还要去了解mysql以及php等等,这也是为了在面试中能够找到一个更好的工作。
综上所述按钮用不用button都无伤大雅,主要的是功能的实现以及浏览器的兼容性。
以上是我的一些看法,感谢大家的观看。
Button适合在表单内自动触发比如type="submit",有时候前端需要更多的控制,所以可以使用p,span,a都行。
不过我们现在还是尽量用button表达按钮,type设置为button,仍然用js监听触发或者有的地方直接用onclick。
因为发展到了H5的地步,button的功能完全能用p覆盖了。
1.现在都用自定义样式,button的样式需要写css覆盖。
2.button如果在form元素下的的话,不加type="button",会直接提交表单,这样每次都加很麻烦。
样式容易控制,行为容易控制。直接用原生button,可能会出现想不到的样式行为问题[机智]。
主要因为两点:
其实从语义化思想来看,按钮不该使用,而应该使用 或 。p 虽然具备 onclick 事件响应,但本意是 html 用来布局的;而 和 本身就是 html 按钮。试一下:在一个纯 html 文档(无任何css和js内容和引用)写上 p 和 button 标签,浏览器都会有默认的渲染效果和交互方式。
主要还是 方便。
button是自带 样式 和 事件 的。
比如默认的巨 丑 按钮和在表单中点击会submit 提交 表单。
而p就是一个块元素,干干净净不用重写,想怎么定义就怎么定义。
对比之下,有什么理由不用p呢?[奸笑]
个人感觉最重要的p可以直接自定义样式,button要消除原有样式很烦。
这个问题不应该问前端开发 应该问一下那些制度W3C为什么这么坑 这么反人类 但凡他们规范制定合理一点好用一点 也不至于前端用p来代替 我们也想好好用button啊
‘贰’ 如何用JS弹出“有输入框并带有是、否、取消按钮”的对话框。
具体代码如下:
<html>
<head>
<script type="text/javascript">
function disp_prompt()
{
var name=prompt("请输入您的名字","小贾")
if (name!=null && name!="")
{
document.write("你好," + name + "!今天过得好吗?")
}
}
</script>
</head>
<body>
<input type="button" onclick="disp_prompt()" value="显示一个提示框" />
</body>
</html>
(2)前端撤回按钮扩展阅读:
prompt() 方法用于显示可提示用户进行输入的对话框。
如果用户单击提示框的取消按钮,则返回 null。如果用户单击确认按钮,则返回输入字段当前显示的文本。
在用户点击确定按钮或取消按钮把对话框关闭之前,它将阻止用户对浏览器的所有输入。在调用 prompt() 时,将暂停对 JavaScript 代码的执行,在用户作出响应之前,不会执行下一条语句。
‘叁’ 网页前端设计如何实现在*/ABC.html页面添加一个按钮,点击跳转到*/en/ABC.html
<button onclick="var p=location.pathname.split('/');var f=p[p.length-1];location.href=location.href.replace(f,'en/'+f);">英文版</button>
‘肆’ 前端一大篇文章 怎么 点击按钮进行 编辑
遍历出来多个input输入框和编辑按钮,当点击任意一个按钮可以获取当前这行input的值!不知道怎么获取,感觉没标识。
<tr>
<td><input type="text" name="car_number" class="car_number"></td>
<td><input type="button" class="save" value="保存" ></td>
</tr>
<tr>
<td><input type="text" name="car_number" class="car_number"></td>
<td><input type="button" class="save" value="保存" ></td>
</tr>
<tr>
<td><input type="text" name="car_number" class="car_number"></td>
<td><input type="button" class="save" value="保存" ></td>
</tr>
<tr>
<td><input type="text" name="car_number" class="car_number"></td>
<td><input type="button" class="save" value="保存" ></td>
</tr>
‘伍’ 如何在前端页面点击一个按钮后,另一个数据可修改
使用dataGridView1_CellClick事件此事件参数(object sender,DataGridViewCellEventArgs e)
string key=this.dataGridView1.CurrentRow.Cells[e.ColumnIndex].Value.ToString();
e.ColumnIndex获得你所点击的这个单元格的列索引号。
传递参数的话,方法比较多。
假如在A窗体中有DataGridView控件。要传递到B窗体,可以在B窗体添加一个方法以传参方式传递数据。当点击A窗体的按钮打开B窗体前调用此方法传递数据key即可。
或者可以在B窗体添加属性,在A窗体的按钮点击事件中为B窗体的这个属性赋值即可。
或者可以采用为B窗体添加构造用构造传参。
‘陆’ 关于web前端的一个如何使按钮连接的方法
<html>
<head>
<title>简易计算器</title>
<script>
functiondisplay(val){
vardisplay=document.getElementById("display");
display.value+=val;
}
functionresult(){
vardisplay=document.getElementById("display");
varres=eval(display.value);
display.value=res;
}
functiontoClear(){
document.getElementById("display").value="";
}
window.onload=function(){
document.onkeydown=function(e){
e=e||event;
varkeyCode=e.keyCode;
//alert(keyCode);
varshiftKey=e.shiftKey;
if(shiftKey){//shift+按键
switch(keyCode){
case56:
display("*");
break;
case187:
display("+");
break;
}
}else{//普通按键
switch(keyCode){
case48:
case49:
case50:
case51:
case52:
case53:
case54:
case55:
case56:
case57:
display(keyCode-48);
break;
case67:
toClear();
break;
case106:
display("*");
break;
case107:
display("+");
break;
case109:
case189:
display("-");
break;
case111:
case191:
display("/");
break;
case187:
result();
break;
}
}
}
}
</script>
<styletype="text/css">
input{
height:2.5em;
width:5em;
}
input#display{
width:100%;
}
</style>
</head>
<body>
<tableborder="1"align="center"frame="box"rules="all">
<tr>
<tdcolspan="3"><inputtype="text"id="display"disabled/></td>
<td>
<inputname="按钮"type="button"onClick="result()"value="计算"/></td>
</tr>
<tr>
<td><inputtype="button"value="7"onClick="display(this.value)"/></td>
<td><inputtype="button"value="8"onClick="display(this.value)"/></td>
<td><inputtype="button"value="9"onClick="display(this.value)"/></td>
<td><inputtype="button"value="+"onClick="display(this.value)"/></td>
</tr>
<tr>
<td><inputtype="button"value="4"onClick="display(this.value)"/></td>
<td><inputtype="button"value="5"onClick="display(this.value)"/></td>
<td><inputtype="button"value="6"onClick="display(this.value)"/></td>
<td><inputtype="button"value="-"onClick="display(this.value)"/></td>
</tr>
<tr>
<td><inputtype="button"value="1"onClick="display(this.value)"/></td>
<td><inputtype="button"value="2"onClick="display(this.value)"/></td>
<td><inputtype="button"value="3"onClick="display(this.value)"/></td>
<td><inputtype="button"value="*"onClick="display(this.value)"/></td>
</tr>
<tr>
<td><inputtype="button"value="."onClick="display(this.value)"/></td>
<td><inputtype="button"value="0"onClick="display(this.value)"/></td>
<td><inputtype="button"value="C"onClick="toClear()"/></td>
<td><inputtype="button"value="/"onClick="display(this.value)"/></td>
</tr>
</table>
</body>
</html>
其实主要就是加个键盘事件监听,这里用的keydown,改成keyup亦可,然后主要是了解思想,代码仅供参考
‘柒’ web前端中fc-button是什么框架里边的按钮
button是按钮的意思,一般出现在<input />标签当中
‘捌’ 前端javascript如何阻止按下返回键页面回退
document.onkeydown=function(e){
e.stopPropagation();//阻止事件冒泡传递
e.preventDefault();//阻止浏览器默认事件的发生
//yourcode
if(e.keyCode==8){//keyCode==8表示按下的回退按钮
}
}
‘玖’ jQuery怎么写撤销
看你是要撤销什么了,举个例子:例如你点击按钮删除某一段文字,就是把这些文字移除掉,但是因为有可能需要恢复,所以在移除之前声明一个数组,把相关的文本推进数组保存,然后再移除,这样在要恢复(就是撤销)的时候再把数组里面的东西取出来放到原来的位置就可以了
,但是,但是,但是。。。
这样是不对的,因为如果你刷新了页面,那么数据就没有了,那么应该是是把拿到得数据保存在浏览器缓存上。撤销的时候在拿回来。
但是,但是,但是,这样还是不对的,因为如果这些删除的东西很大超过了浏览器缓存呢?
所以,正确的写法是:做一个状态,点击删除的时候把它隐藏掉,点击撤销的时候显示。
为什么要这么写呢,因为前端一般是做一些假删除,真的删除是要通过后台去操作数据库的
,但是我们前段要实现这些功能的话可以通过设置状态来做假删除。
‘拾’ 前端,如何获取选择文件的那个按钮
要使用JavaScript选择单选按钮的状态,需要选中单选按钮对象的checked属性,本篇文章介绍的就是使用JavaScript获取单选按钮的选择状态的方法。
可以从名称获取文本框和复选框的控件,但是对于单选按钮,如果将其设置为相同的单选按钮组,则不能使用从名称获取,因为名称的值相同。我们将从之前介绍的ID中检查选择状态。