如何乘法结果基础上，从下拉菜单

Question

我使用我想定制我的需要WordPress的插件，但我很新的JavaScript的选择。该插件计算两个邮政编码之间的距离，即$距离。我创建了一个基于车辆大小的不同值的下拉菜单。我想要做的是显示距离乘以分配给每个车辆尺寸的值（这是每英里的成本）。任何帮助，将不胜感激。谢谢。

<?php 
/** 
* Plugin Name: WP Distance Calculator 
* Plugin URI: http://phpcodingschool.blogspot.com/ 
* Description: This plugin claculates distance between two near by locations. 
* Version: 1.0.0 
* Author: Monika Yadav 
* Author URI: http://phpcodingschool.blogspot.com/ 
* License: GPL2 
*/ 

class DistanceWPCalculator 
{ 
public function __construct() 
{  //action definations 
     add_shortcode('distance_calculator', array(&$this, 'distanceWPfrontend')); 

     add_action('wp_ajax_nopriv_distancewpcalculator', array(&$this, 'distancewpcalculator_calculate')); 
     add_action('wp_ajax_distancewpcalculator', array(&$this, 'distancewpcalculator_calculate')); 

     add_action('init', array(&$this, 'init')); 
} 

public function init() 
{ 
    wp_enqueue_script('distancewpcalculator', plugin_dir_url(__FILE__) . 'js/calculatedistance.js', array('jquery')); 
    wp_localize_script('distancewpcalculator', 'DistanceCalculator', array(
     'ajaxurl' => admin_url('admin-ajax.php') 
    )); 
    ?> 
    <script> 
    var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>"; 
    </script> 
    <?php 
    wp_enqueue_style('DistanceWPCalculator-Style', plugin_dir_url(__FILE__) . 'css/style.css', array(), '0.1', 'screen'); 
} 

public function distancewpcalculator_calculate() 
{ 
    // The $_POST contains all the data sent via ajax 
    if (isset($_POST)) { 

    $from = urlencode($_POST['from']); 
    $to = urlencode($_POST['to']); 
    $data = file_get_contents("http://maps.googleapis.com/maps/api/distancematrix/json?origins=$from&destinations=$to&language=en-EN&sensor=false"); 
    $data = json_decode($data); 
    $time = 0; 
    $distance = 0; 
     foreach($data->rows[0]->elements as $road) { 
      $time += $road->duration->value; 
      $distance += $road->distance->value; 
     } 
     $time =$time/60; 
     $distance =round($distance/1609.344); 

     //Output 
     if($distance!=0){ 

     echo "<div id='result_generated'>"; 
     echo "From: ".$data->origin_addresses[0]; 
     echo "<br/>"; 
     echo "To: ".$data->destination_addresses[0]; 
     echo "<br/>"; 
     echo "Time: ".gmdate("H:i", ($time * 60))." hour(s)"; 
     echo "<br/>"; 
     echo "Distance: ".$distance." mile(s)"; 
     echo "</div>";   
     }else{ 
     echo "Sorry only nearby distance can be calculated."; 
     }     
     } 

die(); 

} 

//Function to display form on front-end 
public function distanceWPfrontend($atts) { 

?> 
    <form method ="post" id="calculator" > 
     <div class="DC_title">Distance Calculator</div> 
     <input type="text" id="from" name="from" placeholder="From.."></br> 
     <input type="text" id="to" name="to" placeholder="To.."></br> 
     <select id="carType" onchange="carsize()"> 
      <option value=".45">Motorcycle</option> 
      <option value=".6">Small Sedan</option> 
      <option value=".65">Large Sedan</option> 
      <option value=".7">Wagon/Hatchback</option> 
      <option value=".7">Small SUV</option> 
      <option value=".8">Large SUV</option> 
      <option value=".8">Minivan</option> 
      <option value=".75">Small Truck</option> 
      <option value=".8">Large Truck</option> 
     </select> 
     <input type="button" id="calculate" name="calculate" value="Calculate"> 
    </form></br> 
    <div id="result"></div> 
    <?php 
} 

} 

$distancewpcalculator = new DistanceWPCalculator(); 

?> 

Answer 1

这实际上是PHP。在您的distancewpcalculator_calculate()函数中，您可以根据Google Maps API返回的结果计算距离。您存储在$distance变量（特别$distance =round($distance/1609.344);)计算出的距离在那项任务将转换为记录$distance值从公里到宓

你应该修改你的HTML select标签和值是这样的：

<select id="carType" name="carType"> 
    <option value=".45">Motorcycle</option> 
    <option value=".6">Small Sedan</option> 
    <option value=".65">Large Sedan</option> 
    <option value=".7">Wagon/Hatchback</option> 
    <option value=".7">Small SUV</option> 
    <option value=".8">Large SUV</option> 
    <option value=".8">Minivan</option> 
    <option value=".75">Small Truck</option> 
    <option value=".8">Large Truck</option> 
</select> 

这样做将包含$_POST数据中的“carType”值，现在它已存在于发布数据中，您可以通过执行$_POST['carType']来获取选定的值。现在数据已记录，我们可以将距离值乘以carType选择。

public function distancewpcalculator_calculate() 
{ 
    // The $_POST contains all the data sent via ajax 
    if (isset($_POST)) { 
     ... 
     $distance = round($distance/1609.344); 

     $carType = $_POST['carType']; 
     $cost = $carType * $distance; 

     //Output 
     if ($distance != 0) { 
      ... 
      echo "Distance: " . $distance . " mile(s)"; 
      echo "<br />"; 
      echo "Cost: {$cost}"; 
      echo "</div>"; 
     } else { 
      ... 
     } 
    } 
} 

计算得出的$cost是选定车型（$carType）和两个位置之间计算的距离（$distance）的乘积;