0

量が増えるにつれて書籍の価格を生成するために ajax を使用しています。私が抱えている唯一の問題は、合計を生成しようとしたときであり (JS コードを参照)、いくつかの問題が発生しました (値は加算ではなく連結されます)。変数「金額」を丸めることで問題を解決しました。しかし、連結が起こった理由を理解しようとしています。これが私のPHPコードです：

if(isset($_GET["amount1"]) )
{
    $amount1 = $_GET["amount1"];

    $error="";

    if($amount1 == "" || !preg_match("/^[0-9]+$/", $amount1))
    {
        $error .= "Please enter a valid number";
        echo $error;
    }
    else{
        echo round($amount1*16.65, 2);
    }
}

そして、これはJSコードです：

      if(xhr.status == 200 && xhr.readyState == 4)
      {
        var res = xhr.responseText;

        if(res.match(/\d+/)== null){
            document.getElementById("err3").innerHTML = res;
            document.getElementById("book3").innerHTML = "";
            total(0,3);
        }

        else{
            document.getElementById("book3").innerHTML = res;
            document.getElementById("err3").innerHTML = "";
            total(res,3);
          }
      }


var book1 = 0;
var book2 = 0;
var book3 = 0;

function total(amount, book)
{   
// amount = Math.round(amount*100)/100; --> this is what solved it but I don't    
 //know why I need it since amount was rounded by PHP code
if( book == 1)
    book1 = amount;

if( book == 2)
    book2 = amount;

if( book == 3)
    book3 = amount;

var total = book1 + book2 + book3;

document.getElementById("total").innerHTML = total;

}

ありがとう

4

2 に答える 2

4

resテキストです。使用する前に数値に変換してください。

js> parseFloat("3.14")
3.14
于 2012-04-11T01:39:12.820 に答える
0

連結している理由は、+演算子が文字列の連結と追加の両方に使用されているためです。しかし、より具体的には、何らかのラッパー (json または xml) なしでサーバーから入力フィールドに入力された値またはブラウザーに渡された値は、javascript によって常に文字列として処理され、javascript は PHP とは異なり、型のジャグリングをサポートしていないためです (少なくとも数字と文字列の間ではありません)。

これは ajax 経由で php から送り返されており、php が数値の検証を処理しているため、値を json 形式で返し、返されたオブジェクトを使用するように JavaScript を更新する必要があります。

まず、検証にわずかな調整を加えた PHP です。

// 1. Using ctype_digit function to confirm value is >= 0. Much faster than regex
// 2. No need to round, as integer * float is always same or less precision, and
//    PHP sets product to appropriate numeric type.
// 3. Pushing values into array for json encoding
// 4. Setting both values (empty if invalid) so that javascript can easily confirm
//    response.
// 5. Updated Error, as negative numbers and floats are valid, 
//    just not in this case

$amount1 = $_GET["amount1"]);
$response["amount1"] = (ctype_digit($amount1)) ? $amount1 * 16.65 : "";
$response["error"] = (ctype_digit($amount1)) ? "" : "Please enter a valid quantity";

echo json_encode($response);

ここで、JavaScript は を使用して応答文字列をオブジェクトにデシリアライズしeval()、合計などを取得する必要があります。

JavaScript (繰り返しますが、いくつかの微調整、今回はメモなし)

if(xhr.status == 200 && xhr.readyState == 4)
{
    var res = eval("(" + xhr.responseText + ")"); 

    amount1 = (!isNaN(res.amount1)) ? res.amount1 : "";     

    document.getElementById("err3").innerHTML = res.error;
    document.getElementById("book3").innerHTML = res.amount1;
    document.getElementById("total").innerHTML = total(Number(res.amount1),3);
}

var book1 = 0;
var book2 = 0;
var book3 = 0;

function total(amount, book)
{
switch (book) {
   case 1:
      book1 = amount;
      break;
   case 2:
      book2 = amount;
      break;
   case 3:
      book3 = amount;
      break;
}

return book1 + book2 + book3;
}

totalここで、最終的に amount1 の値を関数に渡すときに、実際にそれを関数にラップしていることに気付くでしょう。これにより、Number()JSON を使用しなくても問題はほとんど解決されます。理論的には、PHP が常に数値を返す場合、これを行う必要はありません。それにもかかわらず、 Number 型にキャストする理由は次のとおりです。

  1. js は数値の型ジャグリングを行わないため、これは良い考えです。悪い日に PHP が何を返すかはわかりません。また、通信の両端で検証を行う必要があります。

  2. これにより、PHP は値として空の文字列を返すことができます。これをユーザーに出力してから、Number()その空の文字列を0total 関数に設定します。

  3. ajax メソッドをスキップしてブラウザー側で価格計算を行うことにした場合は、常に を使用して値をキャストする必要があるNumber()ため、外部ソースからの数値を処理するときに (面倒ではありますが) 習慣化することをお勧めします。 .

私はあなたの全体的な目標にどのようにアプローチするかの最終バージョンでjsfiddleをいくつか投稿します.あなたはそれを無視するか盗むことができます.

于 2012-04-11T04:49:27.040 に答える