您的位置:首页 > 其它

分享一个超简易计算器

2016-09-14 14:07 239 查看
效果图



htm代码

</pre><pre name="code" class="html"><!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>
<script type="text/javascript" src="../images/jquery-1.9.1.js"></script>
<script type="text/javascript" src="../ajax/dataHandler.js"></script>
<script type="text/javascript" src="../financeStatistics/debitCount.js"></script>
<title></title>
</head>
<body>
<p>客户划账记录</p>
<!-- 查询区 -->
<div>
<input id="btnAdd" type="button" value="新增" onclick="btnNewClick();"/>
<input id="btnEdit" type="button" value="修改" onclick="btnEditClick();"/>
<input id="btnDelete" type="button" value="删除" onclick="btnDeleteClick();"/>
<br />
公司:<select id="selectCompany" onchange="selectCompanyOnChange()">
</select>
部门:<select id="selectDepart" onchange="selectDepartOnChange()">
</select> 
日期:<input id="txDateSearch" type="text" />
送气编号/客户名称:<input id="txSearch" type="text" />
<input id="btnSearch" type="button" value="查询" onclick="btnSaveClick();"/>

</div>
<!-- 统计报表区 -->
<div>
<table id="list">
<thead>
<tr>
<th class="style1" >选择</th>
<th class="style1" >区域</th>
<th class="style1" >站点</th>
<th class="style1">送气编号</th>
<th class="style1">客户名称</th>
<th class="style1">划账金额</th>
<th class="style1">划账银行</th>
<th class="style1">划账日期</th>
</tr>
</thead>
<tbody>
<!-- 动态插入表格 -->
</tbody>
<tfoot>
<!-- 动态页码 -->
</tfoot>
</table>
</div>

<!-- 详细信息的背景蒙板 -->
<div class="mask"></div>
<!-- 详细信息区 -->
<div id="dlgInfo" class="pop_box">
<!-- 标题 -->
<div class="pop_box_hd">
<h3>新增划账客户</h3><!-- 输入框标题 -->
<div class="close_btn">×</div><!-- 关闭按钮 -->
</div>
<!-- 数据录入区 -->
<div>
<p><span>公司:</span><select id="selectCompanyDetail" onchange="selectCompanyDetailOnChange()">
</select></p>
<p><span>部门:</span><select id="selectDepartDetail" onchange="selectDepartDetailOnChange()">
</select></p>
<p><span>客户姓名:</span><select id="selectCustomer" onchange="selectCustomerOnChange()">
</select></p>
<p><span>送气编号:</span><select id="selectGasCode" onchange="selectGasCodeOnChange()">
</select></p>
<p><span>银行:</span><select id="selectBank">
</select></p>
<p><span>划账金额:</span><input id="txDebit" type="text" /></p>
<p><span>划账日期:</span><input id="txDate" type="text" /></p>
</div>
<!-- 按钮区 -->
<div class="btn_box">
<div class="btn_box_inner cf">
<a href="#" id="btnSave" onclick="btnSaveClick();" class="btn btn_mid btn_blue fl save_btn">保存</a>
<a href="#" id="btnCancel" onclick="btnCancelClick();" class="btn btn_mid btn_gray fl cancel_btn">取消</a>
</div>
</div>
</div>

</body>
</html>


JScript.js代码

var m_result;
var m_str;
var m_num1; //第一个数据
var m_num2; //第二个数据
var m_pos; //运算方式标志位

function onclickNum(nums)
{
m_str = document.getElementById("txResult");
m_str.value = m_str.value + nums;  //显示数字
}

function onclickClear()
{
m_str = document.getElementById("txResult").value; // $("#txResult").val();
m_str.value = "";      //清空数字
}

/*
function onclickadd()
{
pos = 1;
num1 = str.value;//获取第一个数据
document.getElementById("txt").value = ""; //清除显示的第一个数据
}
function onclickminus()
{
pos = 2;
num1 = str.value; //获取第一个数据
document.getElementById("txt").value = ""; //清除显示的第一个数据
}

*/

function calculateClick(flag)
{
m_pos = flag;
m_num1 = m_str.value; //获取第一个数据
document.getElementById("txResult").value = ""; //清除显示的第一个数据
}

function onclickresult()
{
m_num2 = document.getElementById("txResult").value;
switch (m_pos)
{
case (1): //加法
m_result = m_num1 * 1 + m_num2 * 1;
break;
case (2): //减法
m_result = m_num1 * 1 - m_num2 * 1;
break;
case (3): //乘法
m_result = m_num1 * 1 * m_num2 * 1;
break;
case (4): //除法
m_result = (m_num1 * 1) / (m_num2 * 1);
break;
default:
break;
}
document.getElementById("txResult").value = m_result;
}


JScript.js代码
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: