텍스트 필드에 여러 개의 숫자를 입력하고 jquery를 사용하여 답변을 알려줍니다.

javascript 및 jquery에 새로 도입되었습니다. 연습을 시도하고 사용자가 텍스트 필드에 입력 한 두 숫자를 취하고 곱하기 버튼을 클릭하면이 응답을 경고합니다().텍스트 필드에 여러 개의 숫자를 입력하고 jquery를 사용하여 답변을 알려줍니다.

<body> 

<script> 
    $(document).ready(function(){ 
     var first = $('#first').value; 
     var second = $('#second').value; 
     $('#multiply').click(function(){ 
      alert(first*second); 
     }); // end click 
    }); // end ready 
</script> 

First Number: 
<input type="text" id="first"><br > 

Second Number: 
<input type="text" id="second"><br > 

<input type="button" id="multiply" value="Multiply"> 
<input type="button" id="divide" value="Divide"> 

</body>

출처

2014-10-29 DB1500

나는 당신이 클릭 핸들러 안에서 필드 값을 읽을 필요가 있다고 말할 것이다. var second = $ ('# second'). value; alert (first * second);}) 함수는 다음과 같은 함수를 호출합니다. ; '사용자 입력 전에 pageload 이후에 실행되기 때문에. – eckes

나는 좋을 것 :

$(document).ready(function(){ 
    $('#multiply').click(function(){ 
     var first = parseFloat($('#first').val()); 
     var second = parseFloat($('#second').val()); 
     console.log(first*second); 
    }); // end click 
}); // end ready

val()는 jQuery를 개체에서 value (또는 jQuery를 수집의 첫 번째 요소의 값)를 가져 오는 데 사용됩니다,
parseFloat()<input/> 요소의 문자열을 숫자로 변환하는 데 사용됩니다.

덧붙여 말하자면, 저는 사용자를 덜 좌절시키기 위해 window.alert() 대신 console.log()을 사용하고 있습니다. 하지만 분명히 자신 만의 취향대로 변경할 수는 있습니다 (그러나 콘솔에 로깅 할 때는 사용자 작업을 기각 할 필요가 없습니다).

참고 :

자바 스크립트 :
- parseFloat().
jQuery를 :
- val(). 텍스트 필드의 값을 잡을 때

출처

2014-10-29 00:07:31

또한 클릭 핸들러 내부에 값을 넣거나 페이지가 처음로드되었을 때의 값을 갖습니다. (아무 것도 아니요) –

@Austin : 당황스럽게도 나는 클릭에 포함되지 않았다는 사실을 당신의 의견에 대해 실제로 깨닫지 못했습니다 -handler ...>. < –

@DavidThomas 완벽하게 작동 해 주셔서 감사합니다. 위쪽 및 위쪽. – DB1500

는, 결과는 텍스트입니다. 숫자가 아닙니다. 값을 (전역 적으로 사용 가능한) parseFloat 함수로 숫자로 구문 분석 할 수 있습니다 (또는 숫자에 분수 값이없는 경우 parseInt 함수).

var first = parseFloat($("#first").val()); 
var second = parseFloat($('#second').val());

출처

2014-10-29 00:11:10 Christopher

당신은 완전히 정확합니다. 플로트가 2, 8 또는 16 진수로 표현하기가 꽤 어렵 기 때문에이 둘 모두 parseInt이고 parseFloat이지만, 의미가 있습니다. – Christopher

JQuery와 객체에는 value 속성이 없다, 입력에서 값을 얻기 위해 val 방법을 사용하십시오

var first = $('#first').val(); 
var second = $('#second').val();

을 지금 당신이 코드가 페이지가로드 될 때 값을 얻기 위해 클릭이 발생하면 값을 얻어야합니다.

$(document).ready(function(){ 
    $('#multiply').click(function(){ 
     var first = $('#first').val(); 
     var second = $('#second').val(); 
     alert(first * second); 
    }); // end click 
}); // end ready

곱셈을 할 때 암시 적으로 문자열을 숫자로 변환하고 있습니다. 명시 적으로 문자열을 구문 분석하려면 암시 적 변환에 의존하는 것이 아니라 데이터가 올바른 유형인지 확인하는 것이 좋습니다. 예를 들어 숫자를 추가하려는 경우 + 연산자도 문자열을 연결하는 데 사용되므로 암시 적 변환은 여기서 작동하지 않습니다. 문자열을 숫자로 파싱하려면 parseInt 또는 parseFloat 메서드를 사용합니다. 예 :

var first = parseInt($('#first').val(), 10); 
var second = parseInt($('#second').val(), 10);

출처

2014-10-29 00:11:11 Guffa

$ ('# first')는 jQuery 객체이므로 .val() 메소드를 사용해야합니다. 반면에 DOM이 준비되면 변수를 설정하므로 사용자가 클릭 할 때 변수가 업데이트되지 않습니다.

$(document).ready(function() { 
    var first, second; 
    $('#multiply').click(function() { 
     first = $('#first').val(); 
     second = $('#second').val(); 
     alert(first * second); 
    }); 
});

다른 경우 스크립트 태그는 본문 끝 부분에 있어야합니다. 스크립트 파싱은 동기식이므로 브라우저가 DOM을 준비하는 데 더 많은 시간이 걸립니다. 재미있게 보내세요! :)

출처

2014-10-29 00:17:08 iovis

텍스트 필드에 여러 개의 숫자를 입력하고 jquery를 사용하여 답변을 알려줍니다.

답변

관련 문제