찾다
백엔드 개발PHP 튜토리얼JS+PHP를 사용하여 숫자 입력 후 최대값 표시

이 글에서는 사용자가 숫자를 입력한 후 숫자의 최대값 표시와 관련 위치를 구현하는 JS+PHP를 주로 소개합니다. 이 글에서는 참고하고 공부할 수 있는 자세한 샘플 코드를 제공합니다. 보세요.

이 글에서는 주로 사용자가 숫자를 입력한 후 최대값과 위치를 표시하는 방법을 JS+PHP에 대해 소개합니다. 그 목적은 JS와 PHP의 차이점을 구별하고 좀 더 자세히 살펴보겠습니다. 소개:

Analytics

1. JS 프롬프트를 사용하여 사용자가 입력하려는 값을 입력합니다.

2. HTML 양식의 텍스트 태그를 사용하여 입력된 값을 PHP 처리 파일에 전달합니다.

3. PHP는 수치 판단을 수행하고 최대값과 위치를 선택합니다.

쉬운 것부터 깊은 것까지:

1. JS에서 배열의 최대값을 구합니다.


var a=[10,20,40,30];
 // var max=0;
 var max=a[0];
 for(var i=0;i<a.length;i++){
 if(max<a[i]){
  max=a[i];
 }
 }
 alert("最大数为"+max);

입니다. 여기서 주목할 가치가 있습니다. 변수 max=0을 직접 설정할 수 없습니다. 앞으로 입력하는 숫자가 0보다 작은지 0보다 큰지(대소문자가 0보다 큰지) 확실하지 않으므로 숫자를 선택해야 합니다. 배열에는 max =a[0] 배열의 첫 번째 항목만 포함됩니다.

max=a[0] .

因为JS语言是基于对象面向过程的,JS里面所有的事物都可以是对象,所以它的数组有属性,length就是JS数组的一个获得数组长度的属性,有了这个属性就可以遍历数组,然后进行一一比较.

2.在JS实现获得数组的最大值最小值和他们的位置(即在数组中第几个)

[注:本案例位置+1是为了方便查看,JS数组开始也是0]


var a=[10,20,40,30];
 var max=a[0];//不能指定一个数为最大值[var max=0](除非是确定的情况下),应该用数组里面的值,a[0]即让数组第一个值作为比较的最大值.
 var maxaddress=0;
 var min=a[0];
 var minaddress=0;
 for(var i=0;i<a.length;i++){
  if(max<a[i]){
   max=a[i];
   maxaddress=i
  }
  if(min>a[i]){
   min=a[i];
   minaddress=i
  }
 }
 alert("最大数为"+max+"位置为第"+(maxaddress+1)+"个");
 alert("最小数为"+min+"位置为第"+(minaddress+1)+"个");

3.现在改成用prompt来进行用户输入获得值来求最大值等等.

难点:

       1.如何输入,用prompt

       2.如何将一个字符串转为数组,并且要转换格式呢?

前提知识:

       1.将字符串分割 用到的是JS的string对象的spilt方法(注意,JS一切皆是对象,因此叫方法,不叫函数)

       2.让一个"abc"字符串转为number类型,怎么转.


字符串转数字类型

◆Number

★数字类型的字符串,转换之后得到的数字。var n1="123"; var n2=Number(n1);//123

★★非数字字符串,转换之后得到是NaN。var n1="123abc"; var n2=Number(n1);//Nan 

★小数类型的字符串,转换之后得到的是原数字。var n1="123.23"; var n2=Number(n1);//123.23

 

◆parseInt

★整数数字类型的字符串,转换之后得到的整数数字。var n1="123"; var n2=parseInt(n1);//123

★数字开头的字符串,转换之后得到的是前边的数字。var n1="123abc"; var n2=parseInt(n1);//123

★非数字开头的字符串,转换之后得到的是NaN。。var n1="abc123"; var n2=parseInt(n1);//NaN

★★小数类型的字符串,转换之后取整(小数点直接省略)。var n1="123.53"; var n2=parseInt(n1);//123 var n1="-5.93"; var n2=parseInt(n1);//-5

 

◆parseFloat

★整数数字类型的字符串,转换之后得到的整数数字。var n1="123"; var n2=parseFloat(n1);//123

★数字开头的字符串,转换之后得到的是前边的数字。var n1="123abc"; var n2=parseFloat(n1);//123

★非数字开头的字符串,转换之后得到的是NaN。var n1="abc123"; var n2=parseFloat(n1);//NaN

★★小数类型的字符串,转换之后得到的是原数字。var n1="123.23"; var n2=parseFloat(n1);//123.23

 

转布尔类型

★数字和字符串转完之后为true。

★undefined、null、0转完之后为false.

var n1=123; var n2=Boolean(n1);//true

var n1="123"; var n2=Boolean(n1);//true

var n1="0"; var n2=Boolean(n1);alert(n2);//true

var n1; var n2=Boolean(n1);//false

var n1=null; var n2=Boolean(n1);//false

var n1=0; var n2=Boolean(n1);//false

以上分析完毕,开始书写代码


<script>
  //var a=new Array(-12,34,56,88,32,"aa","-34.33","-34.34",12.23);
  /*var a=new Array(prompt("请输入数字"));
  document.write(a);*/
  var b=prompt("请输入要比较的数,用\",\"号隔开");
  var a=new Array();
  a=b.split(",");
  // for(var j=0;j<a.length;j++){
  //   document.write(a[j]);
  // }
  alert(typeof(a)+" JS数组本质是对象啊!!");//本质是对象 PHP数组就是数组,没有属性(比如length)
  document.write(a+"<br>");
  console.log(a+"<br>");
  var max=parseFloat(a[0]);
  //document.write(max);
  var maxaddress=0;
  var min=parseFloat(a[0]);
  var minaddress=0;
  
  for(var i=0;i<=a.length;i++){
   var shu=parseFloat(a[i]);
   if(shu>max){
    max=shu;
    maxaddress=i;
   }
   if(shu<min){
    min=a[i];
    minaddress=i;
   }
  }
  document.write("最大数为"+max+"位置为第"+(maxaddress+1)+"个"+"<br>");
  document.write("最小数为"+min+"位置为第"+(minaddress+1)+"个");
 </script>

4.以上是JS做处理,我的目的是让JS+PHP+HTML联动起来.

PHP是无法直接前端交互的,即他不能直接获取用户输入的值,而要通过html 的form表单

JS数据传给PHP,你可以用AJAX,但我以后再讲,今天看看有什么方法.

1.制作HTML表单:


<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Document</title>
 
</head>
<body>
 <form action="deal.php" method="post">
 请输入数字:<input type="text" id="shu" name="shuzi" value="">
 <input type="submit" value="提交">
 </form>
 
</body>
</html>

2.JS传值给HTML:


 <script type="text/javascript">
  var a=prompt("请输入数字");
  document.getElementById("shu").value=a;
 </script>

这里有个坑,如果将JS代码写在HTML的header处,会报错,说Uncaught TypeError: Cannot set property 'value' of nullJS 언어는 객체 지향 프로세스를 기반으로 하기 때문에 JS의 모든 것이 객체가 될 수 있으므로 해당 배열은 length는 배열의 길이를 가져오는 JS 배열의 속성입니다. 이 속성을 사용하면 배열을 순회하고 하나씩 비교할 수 있습니다.

2. 배열의 값과 위치(예: 배열의 숫자)

[참고: 보기의 편의를 위해 이 경우의 위치는 +1입니다. JS 배열은 0으로 시작합니다.]


<?php
header("Content-type:text/html;charset=utf-8");
$a=$_POST[&#39;shuzi&#39;];
//var_dump($a);
$b=explode(&#39;,&#39;,$a);
for($i=0;$i<count($b);$i++){
 echo $b[$i];
}
var_dump($b);

$max=$b[0];
$maxaddress=0;
for($j=0;$j<count($b);$j++){
 if($b[$j]>$max){
  $max=$b[$j];
  $maxaddress=$j;
 }

}
echo "最大值是".$max."<br>";
echo "位置为第".($maxaddress+1)."个";


?>

3. 이제 최대값 찾기 등을 위해 사용자 입력을 수행하는 프롬프트를 사용하도록 변경되었습니다.

난이도: 1. 입력 방법, 프롬프트 사용 2. 문자열 변환 방법

선행 지식:

1. JS의 문자열 개체의 분할 메서드는 문자열을 분할하는 데 사용됩니다. (JS에서는 모든 것이 개체이므로 메서드라고 합니다. 함수 아님)

2. "abc" 문자열을 숫자형으로 변환하는 방법

rrreee

위 분석이 완료되면 코드 작성을 시작합니다 rrreee

🎜4. by JS. 내 목적은 JS+PHP+HTML을 연결하는 것입니다. 🎜🎜🎜PHP는 프런트 엔드와 직접 상호 작용할 수 없습니다. 즉, 사용자가 입력한 값을 직접 얻을 수 없지만 html 형식🎜🎜JS 데이터를 전달해야 합니다. AJAX를 사용할 수 있지만 오늘은 어떤 방법을 사용할 수 있는지 살펴보겠습니다.🎜🎜1. HTML 양식 만들기:🎜🎜🎜🎜rrreee🎜2. HTML의 경우:🎜🎜🎜 🎜rrreee🎜여기서 함정이 있습니다. HTML 헤더에 JS 코드를 작성하면 Uncaught TypeError: Cannot set property 'value' of null🎜🎜브라우저 파싱 때문에 오류가 발생합니다. 순서대로, 브라우저가 JS를 구문 분석할 때(숫자 입력이 완료되면) 브라우저는 HTML 구문 분석을 시작합니다. JS는 텍스트 값을 할당하지만 나중에 HTML에서는 텍스트 값이 NULL이라는 것을 구문 분석합니다. 이는 자체 모순입니다. .🎜🎜그래서 최대한 뒤에 JS 코드를 작성해 보세요. HTML을 먼저 파싱한 다음 값을 알려드리겠습니다. (구체적인 상황을 분석하세요. 반드시 모든 JS 코드가 맨 위에 있는 것은 아닙니다.)🎜 🎜5. 좋습니다. HTML은 값을 전달합니다. 이제 PHP를 살펴보세요🎜🎜🎜🎜rrreee🎜여기에서는 주로 폭발(문자열을 배열로 분할) 카운트(배열 수 가져오기)를 살펴봅니다.🎜🎜또한 유형 변환에 주의하세요. 문제는 나중에 추가하거나 직접 작성하세요.🎜🎜🎜🎜위의 마지막 사진:🎜🎜🎜🎜🎜🎜🎜🎜🎜🎜🎜🎜🎜🎜🎜요약🎜🎜🎜

위 내용은 JS+PHP를 사용하여 숫자 입력 후 최대값 표시의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
PHP에서 인터페이스를 어떻게 생성하고 사용합니까?PHP에서 인터페이스를 어떻게 생성하고 사용합니까?Apr 30, 2025 pm 03:40 PM

이 기사는 PHP의 인터페이스를 생성, 구현 및 사용하는 방법을 설명하여 코드 구성 및 유지 관리에 대한 이점에 중점을 둡니다.

crypt ()와 password_hash ()의 차이점은 무엇입니까?crypt ()와 password_hash ()의 차이점은 무엇입니까?Apr 30, 2025 pm 03:39 PM

이 기사에서는 PHP의 암호 해싱에 대한 Crypt ()와 Password_hash ()의 차이점에 대해 논의하여 최신 웹 애플리케이션에 대한 구현, 보안 및 적합성에 중점을 둡니다.

PHP의 크로스 사이트 스크립팅 (XSS)을 어떻게 방지 할 수 있습니까?PHP의 크로스 사이트 스크립팅 (XSS)을 어떻게 방지 할 수 있습니까?Apr 30, 2025 pm 03:38 PM

기사는 입력 유효성 검사, 출력 인코딩 및 OWASP ESAPI 및 HTML 청정기와 같은 도구를 통해 PHP의 크로스 사이트 스크립팅 (XSS) 방지에 대해 논의합니다.

PHP의 자동로드 란 무엇입니까?PHP의 자동로드 란 무엇입니까?Apr 30, 2025 pm 03:37 PM

PHP의 자동로드는 필요할 때 클래스 파일을 자동으로로드하여 메모리 사용을 줄이고 코드 구성을 향상시켜 성능을 향상시킵니다. 모범 사례에는 PSR-4 사용 및 효과적으로 코드 구성이 포함됩니다.

PHP 스트림이란 무엇입니까?PHP 스트림이란 무엇입니까?Apr 30, 2025 pm 03:36 PM

PHP 스트림은 일관된 API를 통해 파일, 네트워크 소켓 및 압축 형식과 같은 자원의 처리를 통합하여 복잡성을 추상화하고 코드 유연성 및 효율성을 향상시킵니다.

PHP를 사용하여 업로드 할 수있는 파일의 최대 크기는 얼마입니까?PHP를 사용하여 업로드 할 수있는 파일의 최대 크기는 얼마입니까?Apr 30, 2025 pm 03:35 PM

이 기사에서는 PHP의 파일 업로드 크기 관리, 기본 제한 2MB 및 php.ini 설정을 수정하여이를 늘리는 방법에 중점을 둔 파일 업로드 크기 관리에 대해 설명합니다.

PHP의 무효 유형은 무엇입니까?PHP의 무효 유형은 무엇입니까?Apr 30, 2025 pm 03:34 PM

이 기사에서는 PHP 7.1에 도입 된 PHP의 무효 유형에 대해 설명하여 변수 또는 매개 변수가 지정된 유형 또는 널이 될 수 있습니다. 개선 된 가독성, 유형 안전 및 명시 적 의도와 같은 이점을 강조하고 선언하는 방법을 설명합니다.

unset ()와 unlink () 함수의 차이점은 무엇입니까?unset ()와 unlink () 함수의 차이점은 무엇입니까?Apr 30, 2025 pm 03:33 PM

이 기사에서는 Unset ()와 Unlink () 기능의 차이점에 대해 설명합니다. 프로그래밍의 목적 및 사용 사례에 중점을 둡니다. unset ()는 메모리에서 변수를 제거하고 Unlink ()는 파일 시스템에서 파일을 삭제합니다. 둘 다 Effec에 중요합니다

See all articles

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

Video Face Swap

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

뜨거운 도구

ZendStudio 13.5.1 맥

ZendStudio 13.5.1 맥

강력한 PHP 통합 개발 환경

mPDF

mPDF

mPDF는 UTF-8로 인코딩된 HTML에서 PDF 파일을 생성할 수 있는 PHP 라이브러리입니다. 원저자인 Ian Back은 자신의 웹 사이트에서 "즉시" PDF 파일을 출력하고 다양한 언어를 처리하기 위해 mPDF를 작성했습니다. HTML2FPDF와 같은 원본 스크립트보다 유니코드 글꼴을 사용할 때 속도가 느리고 더 큰 파일을 생성하지만 CSS 스타일 등을 지원하고 많은 개선 사항이 있습니다. RTL(아랍어, 히브리어), CJK(중국어, 일본어, 한국어)를 포함한 거의 모든 언어를 지원합니다. 중첩된 블록 수준 요소(예: P, DIV)를 지원합니다.

SecList

SecList

SecLists는 최고의 보안 테스터의 동반자입니다. 보안 평가 시 자주 사용되는 다양한 유형의 목록을 한 곳에 모아 놓은 것입니다. SecLists는 보안 테스터에게 필요할 수 있는 모든 목록을 편리하게 제공하여 보안 테스트를 더욱 효율적이고 생산적으로 만드는 데 도움이 됩니다. 목록 유형에는 사용자 이름, 비밀번호, URL, 퍼징 페이로드, 민감한 데이터 패턴, 웹 셸 등이 포함됩니다. 테스터는 이 저장소를 새로운 테스트 시스템으로 간단히 가져올 수 있으며 필요한 모든 유형의 목록에 액세스할 수 있습니다.

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse를 SAP NetWeaver 애플리케이션 서버와 통합합니다.

MinGW - Windows용 미니멀리스트 GNU

MinGW - Windows용 미니멀리스트 GNU

이 프로젝트는 osdn.net/projects/mingw로 마이그레이션되는 중입니다. 계속해서 그곳에서 우리를 팔로우할 수 있습니다. MinGW: GCC(GNU Compiler Collection)의 기본 Windows 포트로, 기본 Windows 애플리케이션을 구축하기 위한 무료 배포 가능 가져오기 라이브러리 및 헤더 파일로 C99 기능을 지원하는 MSVC 런타임에 대한 확장이 포함되어 있습니다. 모든 MinGW 소프트웨어는 64비트 Windows 플랫폼에서 실행될 수 있습니다.