遇到这么一个需求:

就是可打分数要随着他的打分后要变化,也就是减掉他打分的分数。

想要的结果是打分之后,可打分数减去打分的分数,当更改打分的分数后,当前可打分数复原然后再减去更改的分数。

html代码:

队长打分

当前可打分数分

团队分10%为队长,50%平均,40%队长可奖励给优秀队员,打完分后请记得点击确认!
确 认

js代码:

//获取队长当前可打分数

var ava_fra;

function captain_fraction(){

$.ajax({

url: serverurl,

type: "GET",

data: {

type:'10073',

actid:'100050',

tem:'4'

},

dataType:'JSON',

success: function(result) {

result=eval("("+result+")");

ava_fra = result;

$('.mark em').html(ava_fra);

get_team_info();

},

error: function(jqXHR, textStatus, errorThrown) {

alert('通讯失败,请刷新重试!');

}

});

}

var fraction=[];

//获取队员信息

function get_team_info(){

$.ajax({

url: serverurl,

type: "GET",

data: {

type:'10071',

actid:'100050',

tem:'4'

},

dataType:'JSON',

success: function(result) {

result=eval("("+result+")");

$.hideLoading();

var str = '';

for (var i = 0; i < result.length; i++) {

str += '

'

+ '

'

+ ''

+ '

'

+ '

'

+ '

'+result[i].nickname+'

'

+ '

'+result[i].jobname+'

'

+ '

'

+ '

'

+ '未打分'

+ '打分'

+ '

'

+ '

'

}

$('.play_info').html(str);

},

error: function(jqXHR, textStatus, errorThrown) {

alert('通讯失败,请刷新重试!');

}

});

}

//打分

function mark(e,id){

$.prompt("", "请输入您要打的分数", function(text) {

var re = /^[0-9]+.?[0-9]*$/; //判断字符串是否为数字 //判断正整数 /^[1-9]+[0-9]*]*$/

if (!re.test(text)) {

$.toptips('请输入数字!');

return false;

}

$(e).siblings('.prompt').html('已打'+''+text+''+'分');

// var num = text.replace(/[^0-9]/ig,""); //在字符串中提取数字

$(e).text('更改');

var num = $(e).siblings('.prompt').find('em').text();

// 筛选出更改对象

var obj = fraction.filter(function(value) {

return value.userid === Number(id);

})[0];

// id对应的对象不存在

if (!obj) {

fraction.push({

userid: id,

mark: num

})

return

}

// 对象存在,修改分数

obj.mark = num;

}, function() {

//取消操作

});

}

请教一下这个该怎么做。。谢过哈

**打分修改后的代码:**

//打分

function mark(e,id){

$.prompt("", "请输入您要打的分数", function(text) {

var re = /^[0-9]+.?[0-9]*$/; //判断字符串是否为数字 //判断正整数 /^[1-9]+[0-9]*]*$/

if (!re.test(text)) {

$.toptips('请输入数字!');

return false;

}

$(e).siblings('.prompt').html('已打'+''+text+''+'分');

// var num = text.replace(/[^0-9]/ig,""); //在字符串中提取数字

$(e).text('更改');

var num = $(e).siblings('.prompt').find('em').text();

var diff = 0;

// 筛选出更改对象

var obj = fraction.filter(function(value) {

return value.userid === Number(id);

})[0];

// id对应的对象不存在

if (!obj) {

fraction.push({

userid: id,

mark: num

})

diff = num; // 计算差值

console.log("diff:"+diff);

}else{

diff = obj.mark - num; // 计算差值

console.log(diff)

// 对象存在,修改分数

obj.mark = num;

}

var $markDom = $('.mark em');

// 刷新分数

$markDom.html(Number($markDom.html()) + diff);

console.log("$markDom.html():"+$markDom.html());

}, function() {

//取消操作

});

}

但是有个问题就是修改后的分数第一次被追加到了可打分数后面,而且后面再修改也是不准确,如图:

再次修改代码后:

//打分

function mark(e,id){

$.prompt("", "请输入您要打的分数", function(text) {

var re = /^[0-9]+.?[0-9]*$/; //判断字符串是否为数字 //判断正整数 /^[1-9]+[0-9]*]*$/

if (!re.test(text)) {

$.toptips('请输入数字!');

return false;

}

$(e).siblings('.prompt').html('已打'+''+text+''+'分');

// var num = text.replace(/[^0-9]/ig,""); //在字符串中提取数字

$(e).text('更改');

var num = Number($(e).siblings('.prompt').find('em').text());

var diff = 0;

// 筛选出更改对象

var obj = fraction.filter(function(value) {

return value.userid === Number(id);

})[0];

// id对应的对象不存在

// if (!obj) {

// fraction.push({

// userid: id,

// mark: num

// })

// return;

// }

// obj.mark = num;

// id对应的对象不存在

if (!obj) {

fraction.push({

userid: id,

mark: num

})

diff = num; // 计算差值

} else {

// 对象存在,修改分数

obj.mark = num;

diff = obj.mark - num; // 计算差值

}

console.log("diff:"+diff)

var $markDom = $('.mark em');

// 刷新分数

$markDom.html(Number($markDom.html()) - diff);

console.log("$markDom.html:"+$markDom.html())

}, function() {

//取消操作

});

}

结果:

想要的结果是打分之后,可打分数减去打分的分数,当更改打分的分数后,当前可打分数复原然后再减去更改的分数。

再次修改代码后:

//打分

function mark(e,id){

$.prompt("", "请输入您要打的分数", function(text) {

var re = /^[0-9]+.?[0-9]*$/; //判断字符串是否为数字 //判断正整数 /^[1-9]+[0-9]*]*$/

if (!re.test(text)) {

$.toptips('请输入数字!');

return false;

}

$(e).siblings('.prompt').html('已打'+''+text+''+'分');

// var num = text.replace(/[^0-9]/ig,""); //在字符串中提取数字

$(e).text('更改');

var num = Number($(e).siblings('.prompt').find('em').text());

var diff = 0;

// 筛选出更改对象

var obj = fraction.filter(function(value) {

return value.userid === Number(id);

})[0];

// id对应的对象不存在

// if (!obj) {

// fraction.push({

// userid: id,

// mark: num

// })

// return;

// }

// obj.mark = num;

// id对应的对象不存在

if (!obj) {

fraction.push({

userid: id,

mark: num

})

diff = num; // 计算差值

} else {

diff = num - obj.mark; // 计算差值

// 对象存在,修改分数

obj.mark = num;

}

console.log("diff:"+diff)

var $markDom = $('.mark em');

// 刷新分数

$markDom.html(Number($markDom.html()) - diff);

console.log("$markDom.html:"+$markDom.html());

}, function() {

//取消操作

});

}

结果:

源生除了另一个问题:

当我打分输入等于或者超过12分的时候,就成这样了,当前可打分数是(总分*0.4)

结果修改:

点击 数字随着变化html,js数字随着其他数字变化而变化?相关推荐

  1. JS自制简易版数字华容道小游戏

    最近复习了下前端基础知识HTML+JS(是真的非常基础那种,久不用,基本忘完了). 复习了一小部分内容,闲暇之余打算利用刚复习的js基础知识做个小游戏,刚好手机上下载的游戏集中就有一个数字益智游戏-- ...

  2. js中关于带数字类型参数传参丢失首位数字0问题

    最近在项目中遇到一个问题,js中传带有数字的参数时,如果参数开头有数字0,会把0给去掉. 例如: 方法abc(0123456,789); 方法abc中获取的参数0123456就会变为123456. 原 ...

  3. js判断只能输入数字或小数点

    JS判断只能是数字和小数点 1.文本框只能输入数字代码(小数点也不能输入) <input οnkeyup="this.value=this.value.replace(/\D/g,'' ...

  4. Js将字符串转数字的方式

    Js将字符串转数字的方式 Js字符串转换数字方方式主要有三类:转换函数.强制类型转换.弱类型隐式类型转换,利用这三类转换的方式可以有5种转换的方法. parseInt() parseInt()和Num ...

  5. JS中可以表示数字的最大值

    目录 JS中可以表示数字的最大值 a = "abc" * "bcd"; a = Number.MIN_VALUE; var c = 123 + 456; Boo ...

  6. 正则匹配数字和字母php,用php与js实现正则匹配数字和字母组合的密码

    这次给大家带来用php与js实现正则匹配数字和字母组合的密码,用php与js实现正则匹配数字和字母组合密码的注意事项有哪些,下面就是实战案例,一起来看一下. 本文实例讲述了正则匹配密码只能是数字和字母 ...

  7. js 字符串转化成数字

     js 字符串转化成数字 的 三种方法主要有 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换 ...

  8. Js判断是否为数字,是否为空,是否为整形,是否为浮点型,是否为对象

    Js判断是否为数字,是否为空,是否为整形,是否为浮点型,是否为对象  /**********************一.验证类*****************************/ //对象是否 ...

  9. jquery轻量级数字动画插件 —— countUp.js

    CountUp.js是一个无依赖,轻量级的JavaScript"类",可用于快速创建以更有趣的方式显示数字数据的动画. 该JS插件下载地址:https://github.com/i ...

最新文章

  1. Word2007怎样从随意页開始设置页码 word07页码设置毕业论文
  2. 数据库元数据数据字典查询_8_列出给定表的默认约束
  3. 本机显示服务器文本信息,打开文档显示云服务器
  4. 直播丨MySQL之父Monty来咯,腾讯云CDB/CynosDB技术揭秘之自主可控、前沿探索
  5. Python在Linux地址已在使用,python在linux下的使用
  6. 升级 phpstud y中的 mysql 版本
  7. 飞克速读软件的训练法
  8. matlab gui中断程序,MATLAB GUI的中斷程序
  9. 主流的语音芯片ic方案该如何选 这篇文章可以说清楚
  10. Gmail服务器拒绝发送邮件,向Gmail发送邮件被退信,其他均正常,请协助,谢谢大家...
  11. 【魔兽世界插件】魔兽世界插件实战笔记从入门到放弃的心理历程 第六节 窗体对象的锚定
  12. Learning Git Branching 题解(基础、高级、Git远程仓库)
  13. IBM Tivoli Storage Manager安装介绍
  14. Markdown实用快捷键
  15. Nginx配置中的if判断
  16. easyexcel 检查表头是否匹配_利用easyexcel生成excel文件-自定义表头与数据栏对应的处理方式...
  17. Command ‘pip‘ not found, but can be installed with:
  18. js中ES6新增的数组方法reduce(),和数组去重,降维。
  19. 对称、群论与魔术(九)——魔术《五边形的奇迹》
  20. 理解webpack中的devTool的配置项

热门文章

  1. iOS开发之资料收集
  2. Jquery监听onChange事件
  3. 百度android 升级,百度浏览器app下载_百度浏览器v6.4.21安卓去广告去升级版-这家软件站...
  4. 部署haproxy代理,搭建基于nginx的高性能反向代理群集
  5. 数据结构——二叉树交换左右子树位置(C语言)
  6. Polar vector and axial vector(极矢量和轴向矢量)
  7. OpenPortal认证系统 界面展示
  8. 计算机分辨率启动,电脑启动时分辨率都不对为什么
  9. CSS3新特性——新增选择器,2D/3D转换,动画
  10. 2012IT公司校园招聘笔试面试题