JavaScript订单操作小程序完整版
本文实例为大家分享了完整的订单操作小程序（增加订单，删除订单，修改订单数量），供大家参考，具体内容如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
table {
text-align: center;
}
</style>
<script>
function delRow(id) {
//取得要删除的那一行
var row = document.getElementById(id);//按照id来找到行
var table = document.getElementById('mytb');
table.deleteRow(row.rowIndex);//按照行的索引删除某行的内容
}
function addrow() {
var mytb = document.getElementById('mytb');
var index = mytb.rows.length - 1;//取得插入目标索引，某行
var row = mytb.insertRow(index);//把行插入到某个位置，插入某行
var id = 'row' + row.rowIndex;//拼接id
row.setAttribute('id', id);//设置id
var td0 = row.insertCell(0);//td0创建一个单元格
td0.innerHTML = "好看耐用超耐磨沙发两件套";//设置td0的内容
var td1 = row.insertCell(1);
td1.innerHTML = row.rowIndex;//把行的索引赋给td1的内容
var td2 = row.insertCell(2);//把td2插入在某个单元格里面
td2.innerHTML = '<input type="button" value="删除" onclick="delRow(\'' + id + '\')">' +
'<input type="button" value="修改" id="update" onclick="update(\'' + id + '\')">';
}
function update(id) {
var row = document.getElementById(id);
var td1 = row.cells[1];
var v = td1.innerHTML;
td1.innerHTML = '<input type="text" style="width:30px" value="' + v + '">';
row.cells[2].innerHTML = '<input type="button" value="删除" onclick="delRow(\'' + id + '\')">' +
'<input type="button" value="确定" id="update" onclick="comfirmrow(\'' + id + '\')">';
}
function comfirmrow(id) {
var row=document.getElementById(id);
var td1=row.cells[1];//取得各行的第二个单元格
var input=td1.firstChild;//取得input标签
var v=input.value;//取得input的内容
td1.innerHTML=v;//把内容赋给td1
var td2=row.cells[2];
td2.innerHTML = '<input type="button" value="删除" onclick="delRow(\'' + id + '\')">' +
'<input type="button" value="修改" id="update" onclick="update(\'' + id + '\')">';
}
</script>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="0" id="mytb">
<tr>
<td>商品名</td>
<td>数量</td>
<td>操作</td>
</tr>
<tr id="del1">
<td>好看耐用超耐磨沙发两件套</td>
<td>24</td>
<td><input type="button" value="删除" onclick="delRow('del1')"><input type="button" value="修改"></td>
</tr>
<tr>
<td colspan="3"><input type="button" value="增加订单" onclick="addrow()"></td>
</tr>
</table>
</body>
</html>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
相关推荐
-
js 通用订单代码
复制代码 代码如下: <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServer
-
JavaScript订单操作小程序完整版
本文实例为大家分享了完整的订单操作小程序(增加订单,删除订单,修改订单数量),供大家参考,具体内容如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> table { text-align: center; } </style> <
-
python操作小程序云数据库实现简单的增删改查功能
不止python,你可以利用任何语言那实现通过http请求来操作你自己的小程序云数据库了 背景 也是在最近吧,小程序更新了云开发 HTTP API 文档,提供了小程序外访问云开发资源的能力,使用 HTTP API 开发者可在已有服务器上访问云资源,实现与云开发的互通. 原本云数据库还是相对封闭的,只能通过自己的小程序或者云函数来进行访问,而现在,你只要调用官方提供的接口就能实现对云函数的增删改查了. 这里通过 python 作为演示来进行简单的测试,当然你也可以使用 java , php 等任何
-
使用JavaScript实现一个小程序之99乘法表
废话不多说了,直接给大家贴代码了,具体代码如下所示: <!DOCTYPE html> <html> <head> <title>99乘法表</title> <meta charset="utf-8"> </head> <body> <script type="text/javascript"> for (var i = 1; i <= 9; i++) {
-
JavaScript实现微信小程序打卡时钟项目实例
目录 一.项目展示 二.首页 三.设置 一.项目展示 这是一款简单实用的小时钟工具 分为工作和休息两种状态 用户可以设置相应的时间 所有的时钟记录都会被保存下来 二.首页 首页由计时器.任务输入框和两个计时按钮组成 <view class="container timer {{isRuning ? 'timer--runing': ''}}"> <view class="timer_main"> <view class="ti
-
JavaScript EventEmitter 背后的秘密 完整版
什么是 Event Emitter? Event emitter 听起来只是触发一个事件,这个事件任何东西都能监听. 想象一下这样的场景,在你的异步代码中,去"呼叫"一些事件的发生,以及让你其他部分都要听到你的"呼叫"并且注册他们的想法. 为了不同的目的,对于 Event Emitter 模式有大量不同的实现,但是基本的想法是为了给一个框架提供事件的管理以及能够去订阅他们. 在这里,我们的目标创建属于我们自己的 Event Emitter 去理解背后的秘密.所以,让
-
微信小程序开发探究
前段时间比较流行的微信小程序,因为一直没有所谓内测码也没具体关注.拖到现在正好借组内分享的时机来仔细了解一下微信小程序.了解一个新的事物无外乎从是什么(本质),怎么用(具体用法),为什么用(优缺点)来学习,首先分析一下微信小程序是什么,听起来比较高大上,说实话原来我确实挺疑惑,到底这一套是什么开发机制,native?hybrid?纯h5?看网上各种教程上来就说api说语法,感觉不先理清楚是什么的问题就去搬api过来纯粹是耍流氓. 一.微信小程序是什么: 言归正传,微信小程序的本质是什么?
-
微信小程序实现红包雨功能
本文为大家分享了微信小程序实现红包雨的具体代码,供大家参考,具体内容如下 今天有个小师妹来问我怎样用微信小程序实现红包雨效果,如果用web很好实现,但是小程序不是那么容易,整合自己也有一年没摸过小程序了,决定试一试. 首先明确"红包雨"的需求: 随机位置掉落 随机红包样式 同一时间掉落个数随机 每个红包的掉落速度随机,但不能太快也不能太慢 首先看看我做的效果吧 首先明确小程序实现红包雨和web网页实现红包雨难点上有什么不同: 小程序不能直接操作dom,web网页可以操作 小程序循环渲染
-
钉钉小程序web-view内嵌H5页面并实现通信
目录 前言 1.引入页面 2.在H5页面向钉钉发送消息 3.在钉钉页面向H5发送消息,继而实现双向通信 4.注意 内容调试方式 5.附双向通信全部代码 前言 今天探讨个不太常见的需求,公司需要在钉钉小程序内进行文件的上传,意图打造一个小型云盘,考虑到钉钉的上传大小等有诸多限制,以及数据的安全性,决定在钉钉内使用web-view嵌套H5上传页面,并且在完成上传动作后,需要返回小程序,并执行其他操作. 1.引入页面 在管理端新建页面,同时在钉钉页面使用web-view引入,需要后端配合传入合适的to
-
监控微信小程序中的慢HTTP请求过程详解
Fundebug 的微信小程序监控插件在 0.5.0 版本已经支持监控 HTTP 请求错误,在小程序中通过wx.request发起 HTTP 请求,如果请求失败,会被捕获并上报.时隔一年,微信小程序插件已经更新到 1.3.1, 而且提供了一个非常有用的功能,支持监控 HTTP 慢请求.对于轻量级的性能分析,可以说已经够用. 本文我们以一个天气微信小程序为例(由bodekjan开发),来演示如何监控慢请求.bmap-wx.js中的weather()函数调用百度地图小程序 api 提供的接口来获取天
-
微信小程序保持session会话的方法
一般我们web网站都会有cookie来保存session ID,将用户和服务器保持在一次会话中,但是很遗憾,微信小程序不支持cookie,他的每一次请求就是一次会话,这样就会产生一个问题,每次请求都需要确定当前的用户是谁,但是我们又不能在每次请求的数据中携带用户的信息,这样是不安全的.今天就介绍两种方式来实现保持会话. 第一种:客户端保存session ID 1.通过wx.login接口获取 code,将code传递到后台(一般后台都有shiro或者Spring security这种过滤器,该方