在PHP脚本中通过ajax发送两个jquery变量 [英] Send two jquery variables via ajax in PHP script

问题描述

我有一个带有两个范围滑块的jquery脚本。这些值通过我的php_file.php中的Ajax发送：



html_file.php

< script> 
 $（function（）{
 $（＃slider-range-max）.slider（{
 range：max，
 min：1，
 max：25，
 value：1，
 slide：function（event，ui）{
 $（＃amount）。val（ui.value）; 
 / *这里我们将滑块值发送到PHP * / 
 $ .ajax（{
方法：POST，
 url：php_file.php，
数据：{sliderVal ：ui.value} 
}）
 / *这里我们收到数据* / 
 .done（函数（数据）{
 / *这里你可以做任何你想做的事情数据* / 
 $（＃content）。html（数据）; 
}）; 
} 
}）; 
 $（＃amount ）.val（$（＃slider-range-max）。slider（value））; 
}）; 
 $（function（）{
 $（＃slider-range-max2）.slider（{
 range：max，
 min：1，
 max：4，
 value：1，
 slide：function（event，ui）{
 $（＃amount2）。val（ui.value）; 
 / *这里我们将滑块值发送到PHP * / 
 $ .ajax（{
方法：POST，
 url：php_file.php，
数据：{sliderVal2 ：ui.value} 
}）
 / *这里我们收到的数据是* / 
 .done（函数（data2）{
 / *这里你可以做任何你想做的事情数据* / 
 
 $（＃content）。html（data2）; 
}）; 
} 
}）; 
 $ （＃amount2）。val（$（＃slider-range-max2）。slider（value2））; 
}）; 
 
< / script> 
 
 
 
< input type =textid =amountreadonly style =border：0; color：＃f6931f; font-weight：bold;> ; 
< div id =slider-range-max>< / div> 

php_file.php

<？php 
 $ str = $ _POST [ 'sliderVal']; 
 $ quality = $ _POST ['sliderVal2']; 
 
 $ str2 = file_get_contents（'https://eu.api.battle.net/wow/pet/stats/258?level='。$ str。'& breedId = 5& qualityId = '。$ quality。'& locale = de_DE'）; 
 
 $ json = json_decode（$ str2，true）; //将JSON解码为关联数组
 
 $ n = $ json ['health']; 
 
 echo'< div class =profile-font2>'，$ n，'< / div>'; 
？> 

问题



现在我有两个滑块可以相互独立地改变它们的值。这里的截图可以更好地理解它。如果我更改第二个滑块（质量），则第一个滑块（级别）的值会消失。他们应该受到尊重。因此，在屏幕截图的这种情况下，应该有level = 6

和质量= 2。



如何解决这个问题？



截图



[1]：https：//i.stack.imgur.com/VZVIx.png



我尝试了什么：



我给了

数据：{sliderVal2：ui.value} 

另一个名称，但然后脚本不再工作。

解决方案

（function（）{

（#strip- range-max）.slider（{
范围：max，
min：1，
max：25，
value：1，
slide：function （event，ui）{

（＃amount）。val（ui.value）;
/ *这里我们将滑块值发送到PHP * /

I have a jquery script with two range sliders. The values get send via Ajax in my php_file.php:

html_file.php

<script>
    $( function() {
        $( "#slider-range-max" ).slider({
            range: "max",
            min: 1,
            max: 25,
            value: 1,
            slide: function(event, ui) {
                $("#amount").val(ui.value);
                /* Here we send the slider value towards PHP */
                $.ajax({
                    method: "POST",
                    url: "php_file.php",
                    data: { sliderVal: ui.value }
                })
                /* Here we receive the data back */
                .done(function(data) {
                    /* Here you can do whatever you want with the data */
                   $("#content").html(data);
                });
            }
        });
        $( "#amount" ).val( $("#slider-range-max").slider("value") );
    });
    $( function() {
        $( "#slider-range-max2" ).slider({
            range: "max",
            min: 1,
            max: 4,
            value: 1,
            slide: function(event, ui) {
                $("#amount2").val(ui.value);
                /* Here we send the slider value towards PHP */
                $.ajax({
                    method: "POST",
                    url: "php_file.php",
                    data: { sliderVal2: ui.value }
                })
                /* Here we receive the data back */
                .done(function(data2) {
                    /* Here you can do whatever you want with the data */
    
                    $("#content").html(data2);
                });
            }
        });
        $( "#amount2" ).val( $("#slider-range-max2").slider("value2") );
    });

</script>



<input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
<div id="slider-range-max"></div>

php_file.php

<?php    
    $str = $_POST['sliderVal'];
    $quality = $_POST['sliderVal2'];
    
    $str2 = file_get_contents('https://eu.api.battle.net/wow/pet/stats/258?level='. $str .'&breedId=5&qualityId='. $quality .'&locale=de_DE');
    
    $json = json_decode($str2, true); // decode the JSON into an associative array
    
    $n= $json['health'];
    
    echo '<div class="profile-font2">', $n, '</div>';
    ?>

The Problem

Now I have two sliders which changes their values indepently from each other. Here the screenshot to understand it better. If I change the second slider (quality) the values of the first slider (level) disappeears. They should be both respected. So in this case of the screenshot there should be the level=6
and the quality=2.

How can I fix that?

Screenshot

[1]: https://i.stack.imgur.com/VZVIx.png

What I have tried:

I gave the

data: { sliderVal2: ui.value }

another name but then the script doesn´t work anymore.

解决方案

( function() {

( "#slider-range-max" ).slider({ range: "max", min: 1, max: 25, value: 1, slide: function(event, ui) {

("#amount").val(ui.value); /* Here we send the slider value towards PHP */

这篇关于在PHP脚本中通过ajax发送两个jquery变量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！