您当前的位置: 首页 > 技术文章 > 前端开发

使用JavaScript的效果实现输入相关信息计算票价的效果

作者: 时间:2022-07-30阅读数:人阅读

前段时间家中有事,断更的会一点点补上

目录

1.首先我们先创建一个html文件

2.然后我们开始写js部分代码,先定义三个变量(这里加入Number是把字符型转成数字型)

3.接下来我们根据需求继续添加变量

4.接下来我们通过if条件语句来实现条件

        1.因为这里需求是让我们先选择座位的类型,所以我们要先判断是使用者输入的是什么座

        2.接下来我们开始正式开始,我们开始写根据年龄来影响价格的部分(以硬座的的为例子)

        3.接下来加入身高判断条件

        4.接下来就很简单了,硬座的写出来了,我们只需稍加改动,未成年人购买硬卧只能是减去硬座的一半哦

        5.接下来我们综合一下

5.这是完整代码


首先这是我们的需求

使用JavaScript的效果实现输入相关信息计算票价的效果(图1)

1.首先我们先创建一个html文件

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		
	</body>
</html>

2.然后我们开始写js部分代码,先定义三个变量(这里加入Number是把字符型转成数字型)

<script>
			var sum = prompt('请输入你要购买的票种类')
            var ages = prompt('请输入你的年龄')
			var height = prompt('请输入身高')
            height = Number(height)
			ages = Number(ages)
			
</script>

3.接下来我们根据需求继续添加变量


		<script>
			var sum = prompt('请输入你要购买的票种类')
			var ages = prompt('请输入你的年龄')
			var height = prompt('请输入身高')
			height = Number(height)
			ages = Number(ages)
			// console.log(ages)
			var sum1 = '硬座'
			var sums = '硬卧'
        </script>
		

4.接下来我们通过if条件语句来实现条件

        1.因为这里需求是让我们先选择座位的类型,所以我们要先判断是使用者输入的是什么座

<script>
			var sum = prompt('请输入你要购买的票种类')
			var ages = prompt('请输入你的年龄')
			var height = prompt('请输入身高')
			height = Number(height)
			ages = Number(ages)
			// console.log(ages)
			var sum1 = '硬座'
			var sums = '硬卧'
		
			if (sum == sum1) {

			   }else{
            }
</script>

        2.接下来我们开始正式开始,我们开始写根据年龄来影响价格的部分(以硬座的的为例子)

	
		<script>
			var sum = prompt('请输入你要购买的票种类')
			var ages = prompt('请输入你的年龄')
			var height = prompt('请输入身高')
			height = Number(height)
			ages = Number(ages)
			// console.log(ages)
			var sum1 = '硬座'
			var sums = '硬卧'
		
			if (sum == sum1) {
				if (ages >= 18) {
					alert('你的票价是100元')
				} else {
					
				}
		</script>

这样我们就做到了判断当输入的年龄大于18和小于18的价格。,当然此时小于18的部分由于需求还有一个条件是身高,所以我们要在else里再次套入一个if循环

        3.接下来加入身高判断条件

由需求可知,在120,120-150,150以上这三个区间的价格是不一样的,所以我们要以此为条件,在else里添加嵌套一个if判断.

	
		<script>
			var sum = prompt('请输入你要购买的票种类')
			var ages = prompt('请输入你的年龄')
			var height = prompt('请输入身高')
			height = Number(height)
			ages = Number(ages)
			// console.log(ages)
			var sum1 = '硬座'
			var sums = '硬卧'
		
			if (sum == sum1) {
				if (ages >= 18) {
					alert('你的票价是100元')
				} else {
					if (height < 120) {
						alert('你无需付款,免票')
					} else if (height < 150 && height >= 120) {
						alert('你的票价是50元')
					} else {
						alert('你的票价是100元')
					}
				}
			} 
			
		</script>

                                                        小提示:由于嵌套了一个if,所以大家在写的时候注意花括号哦

        4.接下来就很简单了,硬座的写出来了,我们只需稍加改动,未成年人购买硬卧只能是减去硬座的一半哦

	
		<script>
			var sum = prompt('请输入你要购买的票种类')
			var ages = prompt('请输入你的年龄')
			var height = prompt('请输入身高')
			height = Number(height)
			ages = Number(ages)
			// console.log(ages)
			var sum1 = '硬座'
			var sums = '硬卧'
		
		
			 if (sum == sums) {
				if (ages >= 18) {
					alert('你的票价是190元')
				} else {
					if (height < 120) {
						alert('你无需付款,免票')
					} else if (height < 150 && height >= 120) {
						alert('你的票价是140元')
					} else {
						alert('你的票价是190元')
					}
				}
				}
		</script>

        5.接下来我们综合一下

	
		<script>
			var sum = prompt('请输入你要购买的票种类')
			var ages = prompt('请输入你的年龄')
			var height = prompt('请输入身高')
			height = Number(height)
			ages = Number(ages)
			// console.log(ages)
			var sum1 = '硬座'
			var sums = '硬卧'
		
			if (sum == sum1) {
				if (ages >= 18) {
					alert('你的票价是100元')
				} else {
					if (height < 120) {
						alert('你无需付款,免票')
					} else if (height < 150 && height >= 120) {
						alert('你的票价是50元')
					} else {
						alert('你的票价是100元')
					}
				}
			} 
			 if (sum == sums) {
				if (ages >= 18) {
					alert('你的票价是190元')
				} else {
					if (height < 120) {
						alert('你无需付款,免票')
					} else if (height < 150 && height >= 120) {
						alert('你的票价是140元')
					} else {
						alert('你的票价是190元')
					}
				}
				}
		</script>

                                                                                                            这样整个判断条件就写出来了

5.这是完整代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	<script>
			var sum = prompt('请输入你要购买的票种类')
			var ages = prompt('请输入你的年龄')
			var height = prompt('请输入身高')
			height = Number(height)
			ages = Number(ages)
			// console.log(ages)
			var sum1 = '硬座'
			var sums = '硬卧'
		
			if (sum == sum1) {
				if (ages >= 18) {
					alert('你的票价是100元')
				} else {
					if (height < 120) {
						alert('你无需付款,免票')
					} else if (height < 150 && height >= 120) {
						alert('你的票价是50元')
					} else {
						alert('你的票价是100元')
					}
				}
			} 
			 if (sum == sums) {
				if (ages >= 18) {
					alert('你的票价是190元')
				} else {
					if (height < 120) {
						alert('你无需付款,免票')
					} else if (height < 150 && height >= 120) {
						alert('你的票价是140元')
					} else {
						alert('你的票价是190元')
					}
				}
				}
		</script>
	</body>
</html>

本站所有文章、数据、图片均来自互联网,一切版权均归源网站或源作者所有。

如果侵犯了你的权益请来信告知我们删除。邮箱:licqi@yunshuaiweb.com

加载中~
如果您对我们的成果表示认同并且觉得对你有所帮助可以给我们捐赠。您的帮助是对我们最大的支持和动力!
捐赠我们
扫码支持 扫码支持
扫码捐赠,你说多少就多少
2
5
10
20
50
自定义
您当前余额:元
支付宝
微信
余额

打开支付宝扫一扫,即可进行扫码捐赠哦

打开微信扫一扫,即可进行扫码捐赠哦

打开QQ钱包扫一扫,即可进行扫码捐赠哦

天猫38节现货-全屋智能