동적으로 전체 업데이트 드롭 다운을 통해

약간의 딜레마가 있습니다. 사용자가 드롭 다운 상자에서 옵션을 선택하면 다시로드하지 않고 동일한 페이지의 총계를 동적으로 업데이트 할 수 있도록 노력 중입니다.동적으로 전체 업데이트 드롭 다운을 통해

다른 말로하면 나는 드롭 다운 상자 (1,2,3,4,5)에 5 개의 다른 옵션이 있는데 사용자가 1을 선택하면 간단한 방정식을 거쳐 " 총 상자 "오른쪽에, 내가 다시로드하지 않고이 작업을 동적으로 수행하려는 문제는 아무도 나에게 사용해야 할 조언과 조언 (코드 등 ...)을 줄 수있는 자습서를 줄 수 있습니까?

감사합니다

출처

2012-07-20 Arken

와 함께 작업, 예를 들어이 http://jsfiddle.net/3TMK8/를 참조하십시오. 아무도 지불하지 않고 그것을 쓸 것입니다. 내가 말할 수있는 충고로서 : Ajax를 한번보세요. – Leri

html 코드를 올리시겠습니까? – Nirmal

자바 스크립트로 수행해야합니다.

$("select").change(function(){ 
    var currentValue = parseInt($(this).find("option:selected").val()); 
    //do whatever calculation e.g 
    result = currentValue * 2 + 1; 
    //output result somewhere on the page e.g. 
    $("#output").html(result); 
})

출처

2012-07-20 08:36:40 Horen

브릴리언트, 난 그냥 지금 테스트하고 작동, 내가 생각했던 유일한 다른 것은, 내가 두 똑같은 방정식에 꽂아야 할 두 가지 드롭 다운이 있다고 말합니다, 어떻게 그럴 수 있습니까? – Arken

둘 다 동일한 클래스 이름을 선택하십시오. 'class = "calculate"를 선택하고 1 행의 jQuery selector를'$ ("select")'에서'$ (". calculate")'로 변경하십시오. _Explanation_ : 클래스를 선택자로 사용할 때 해당 클래스가있는 요소가 변경 될 때마다 변경 기능이 호출됩니다. 두 식에서 같은 방정식을 사용하기 때문에이 방법을 선택하십시오. 방정식이 다른 경우 다른 함수를 작성해야합니다. – Horen

모든 도움을 주셔서 감사합니다. – Arken

// 이것은 당신이 DDL

와 페이지에서 사용할 수있는 JQuery와는 : 나는 당신이 원하는 일을 정말 쉽게와 자바 스크립트 프레임 워크 http://jquery.com/

으로 jQuery를 사용하는 것이 좋습니다 수 있습니다 계산 페이지에서

$(document).ready(function() { 
     $("#FloorId").change(function() { 
      var ddlValue = $(this).val(); 

       $.getJSON('calculate.php', { "Id": ddlValue }, function (obj) { 
        $("total").text(obj.value); 
       }); 
     }); 
    });

반환 총

출처

2012-07-20 08:37:39

당신은 데이터베이스에 클라이언트 측 jquery의 간단한 사용을 저장할 필요가없는 경우 수 해. 선택 변경에 대해 "readonly"가 설정된 입력에서 총을 검색 한 다음 사용자가 선택한 현재 숫자를 추가합니다. 선택을 다시 기억 또는 사용자는이 시간에 동일한 번호를 추가 할 수 없습니다

$(document).ready(function(){ 
    $('select#add').change(function(){ 
    var total = parseInt($('input#total').val())+parseInt($(this).val()); 
    $('input#total').val(total); 
     $('select#add option[value=""]').attr('selected', true); 
    }); 
});

코드를 요청하지 마십시오 HTML

출처

2012-07-20 08:45:27 kawashita86

동적으로 전체 업데이트 드롭 다운을 통해

답변

관련 문제