真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

jquery加減,jquery加減法

如何用jquery實現(xiàn)對選中內(nèi)容的值實行加減操作

給你寫好了,很簡單,你預覽的時候記得引用自己的jQuery文件。

康保網(wǎng)站建設(shè)公司成都創(chuàng)新互聯(lián),康保網(wǎng)站設(shè)計制作,有大型網(wǎng)站制作公司豐富經(jīng)驗。已為康保近千家提供企業(yè)網(wǎng)站建設(shè)服務。企業(yè)網(wǎng)站搭建\成都外貿(mào)網(wǎng)站制作要多少錢,請找那個售后服務好的康保做網(wǎng)站的公司定做!

對了,你的table結(jié)構(gòu)有問題,給你稍做了改動。希望對你有用,呵呵

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""

html xmlns=""

head

meta http-equiv="Content-Type" content="text/html; charset=utf-8" /

style type="text/css"

.changeBG{

background-color:#09F;}

input{

background-color:#E6EFF0;}

.quick span{

display:block;

float:left;

cursor:pointer;

padding:3px;}

label{

cursor:pointer;}

/style

script src="../scripts/jquery-1.4.js" type="text/javascript"/script

script type="text/javascript"

var A=[1,3,9]; //選項A的列表

var B=[2,4,6]; //選項B的列表

$(function(){

$('.quick:contains("A")').click(function(){

change('input',A);});

$('.quick:contains("B")').click(function(){

change('input',B);});

$('.quick:contains("反選")').click(function(){

turnOver();});

$('.quick:contains("取消")').click(function(){

abolish();});

$('.quick span:contains("-")').click(function(){

decrease(10);});

$('.quick span:contains("+")').click(function(){

increase(10);});

$('label').parent().click(function(){

$(this).next().children().toggleClass('changeBG')});

});

function change(str,arr){

for(i=0;iarr.length;i++)

$($(str).get(arr[i]-1)).addClass('changeBG');}

function abolish(){

$('input').removeClass('changeBG');}

function turnOver(){

$('input').toggleClass('changeBG');}

function increase(num){

var a=$('.changeBG');

for(i=0;ia.length;i++)

$(a[i]).val($(a[i]).val()*1+num);}

function decrease(num){

var a=$('.changeBG');

for(i=0;ia.length;i++)

$(a[i]).val($(a[i]).val()*1-num);}

/script

title無標題文檔/title

/head

body

table border="0" align="center" cellpadding="0" cellspacing="0"

tr

td align="left"

table

tr

td class="quick"a href="#"FONT color=redA/FONT/a/td

td class="quick"a href="#"FONT color=blueB/FONT/a/td

td class="quick"a href="#"反選/a/td

td class="quick"a href="#"取消/a/td

/tr

/table

/td

/tr

tr

td align="left"

table cellpadding="0" cellspacing="1" border="0"

tr

th序號/th

th值/th

th序號/th

th值/th

th序號/th

th值/th

th序號/th

th值/th

th序號/th

th值/th

/tr

tr

td align="right"label1/label/td

tdinput type="text" name="num[]" value="100" size="12"http://td

td align="right"label2/label/td

tdinput type="text" name="num[]" value="110" size="12"http://td

td align="right"label3/label/td

tdinput type="text" name="num[]" value="120" size="12"http://td

td align="right"label4/label/td

tdinput type="text" name="num[]" value="130" size="12"http://td

td align="right"label5/label/td

tdinput type="text" name="num[]" value="140" size="12"http://td

/tr

tr

td align="right"label6/label/td

tdinput type="text" name="num[]" value="200" size="12"http://td

td align="right"label7/label/td

tdinput type="text" name="num[]" value="210" size="12"http://td

td align="right"label8/label/td

tdinput type="text" name="num[]" value="220" size="12"http://td

td align="right"label9/label/td

tdinput type="text" name="num[]" value="230" size="12"http://td

td align="right"label10/label/td

tdinput type="text" name="num[]" value="240" size="12"http://td

/tr

/table

/td

/tr

tr

td align="left" class="quick"

span-/span

span10/span

span+/span

/td

/tr

/table

/body

/html

jQuery實現(xiàn)數(shù)字加減效果匯總

我們在網(wǎng)上購物提交訂單時,在網(wǎng)頁上一般會有一個選擇數(shù)量的控件,要求買家選擇購買商品的件數(shù),開發(fā)者會把該控件做成可以通過點擊實現(xiàn)加減等微調(diào)操作,當然也可以直接輸入數(shù)字件數(shù)。

左右加減數(shù)字

像京東提交訂單時目前使用的是左右加減數(shù)字的效果,這個效果直接明了,操作簡單。我們使用jquery.spinner.js插件實現(xiàn)左右加減數(shù)字,調(diào)用方法非常簡單。

復制代碼

代碼如下:

input

type="text"

class="spinner"/

調(diào)用也非常簡單,先載入jquery庫文件和jquery.spinner.js,然后使用以下代碼:

復制代碼

代碼如下:

$('.spinner').spinner();

Bootstrap風格,右側(cè)加減

Bootstrap火了很久了,基于bootstrap風格的各類應用也非常多,下面給大家介紹一個基于bootstrap的數(shù)字加減插件,可以設(shè)置最小值、最大值、遞增遞減(步長值),可手動輸入數(shù)字。

復制代碼

代碼如下:

div

class="input-group

spinner"

data-trigger="spinner"

id="spinner"

input

type="text"

class="form-control"

value="1"

data-max="10"

data-min="1"

data-step="1"

div

class="input-group-addon"

a

href="javascript:;"

class="spin-up"

data-spin="up"i

class="icon-sort-up"/i/a

a

href="javascript:;"

class="spin-down"

data-spin="down"i

class="icon-sort-down"/i/a

/div

/div

將bootstrap相關(guān)css和js文件載入后,便可直接看到頁面效果,如果你的項目基于bootstrap,那么直接就可以調(diào)用它了。

您還可以參考該項目地址:查看相關(guān)參數(shù)設(shè)置。

jQuery

ui風格,右側(cè)加減

jQuery

ui也提供了數(shù)字加減插件,可以設(shè)置最小值、最大值、遞增遞減(步長值),可手動輸入數(shù)字。

復制代碼

代碼如下:

input

type="text"

id="spinner"/

如果你的項目使用了jquery

ui,那就可以調(diào)用jquery

ui來實現(xiàn)數(shù)字加減的功能了。

復制代碼

代碼如下:

$("#spinner").spinner({

max:10,

min:0,

step:2

});

以上幾種就是本人在項目中使用的關(guān)于jQuery實現(xiàn)數(shù)字加減的方法,整理出來分享給大家用,雖然功能比較簡單,但是很實用。

jquery實現(xiàn)了點擊事件,點擊加減按鈕然后總價動態(tài)改變,怎么讓輸入框直接輸入的內(nèi)容也能讓總價改變

用oninput事件,在用戶輸入時觸發(fā)。

例如:

html:

input?type="text"?id="qty_item_1"?oninput="change_total()"

js:

function?change_total()?{

var?z?=?$("#qty_item_1").val();

var?zz?=?z*1999;

$("#total_item_1").text(zz);

}

jquery 如何即時加減計算

jquery部分

function?testAdd(){????????

var?aa=$("#aa");????????

var?bb=$("#bb");

a=parseInt(aa.val());

b=parseInt(bb.val());

b=b+a;

bb.val(b);

bb.innerHTML=bb.value;

}????

function?testSub(){????????

var?aa=$("#aa");????????

var?bb=$("#bb");

a=parseInt(aa.val());

b=parseInt(bb.val());

b=b-a;

bb.value=b;

bb.innerHTML=bb.value;

}

html部分

body????

input?type="button"?name="add"?value="add"?onclick="testAdd()"????

input?type="text"?id="aa"????

input?type="button"?name="sub"?value="sub"?onclick="testSub()"????

br/????

購物車????

input?type="text"?value="100"?id="bb"

/body

jquery怎么實現(xiàn)點擊加減按鈕調(diào)整數(shù)量的同時動態(tài)的改變顯示的總價?

拿到input的值 當點擊+ 索引++就好了 后面的同理 拿到索引*2你的價格就OK了


本文題目:jquery加減,jquery加減法
地址分享:http://weahome.cn/article/dsishdo.html

其他資訊

在線咨詢

微信咨詢

電話咨詢

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部