html 组合成的类似select的点选

答案:2 悬赏:20

解决时间 2021-05-12 10:40

提问者网友：騷女、無惡不作
2021-05-11 16:34

我现在想做一个上图这样的点选组件。应该是一个text，两个button组成。点击向上的按钮年份就加一，点击向下的按钮年份就减一。功能我到知道怎么实现，但是不知道怎么做出这样的样子。

希望有人指教！谢谢！

最佳答案

二级知识专家网友：如果这是命
2021-05-11 17:12

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns=" http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
#dd{width:40px; height:22px; border:1px solid #000; font-size:12px; line-height:22px; padding:0 5px; overflow:hidden}
#dd span{float:left; display:inline;}
#dd #d_text{height:100%; border-right:1px solid #000; padding-right:5px;}
#dd .d_arrow{line-height:10px; font-size:10px; margin:2px 0 0 3px; cursor:pointer}
</style>
</head>

<body>
<div id="dd">
    <span id="d_text">2013</span>
    <span id="d_arrow_up" class="d_arrow" onclick="ystr.add()">▲</span>
    <span id="d_arrow_down" class="d_arrow" onclick="ystr.minu()">▼</span>
    </div>
</body>
</html>
<script type="text/javascript">
var ystr={
obj : document.getElementById("d_text"),
add : function(){
  this.obj.innerHTML=this.obj.innerHTML-0+1;
},
minu : function(){
  this.obj.innerHTML=this.obj.innerHTML-1;
}
}
</script>

做了一个例子,直接复制到HTML文件

做的不太精细,箭头你可以用图片代替.

全部回答

1楼网友：零负荷的放任
2021-05-11 17:56

我要举报

如以上问答内容为低俗、色情、不良、暴力、侵权、涉及违法等信息，可以点下面链接进行举报！