我如何獲取zurb基礎滑塊數據表單值

Question

我在這里使用一些Foundation組件制作表單。 我正在使用滑塊：

// the slider element. starts at 1 ends at 4 allows 1 step at a time
    <div class="slider" data-slider data-start="1" data-initial-start="1" data-step="1" data-end="4">
    <span class="slider-handle"  data-slider-handle role="slider" tabindex="1" aria-controls="select"></span>
    <span class="slider-fill" data-slider-fill></span>
    </div>

// the input box that shows the sliders value
    <input type="number" id="select" name="select" size="2">

現在這是我需要解決的問題，提交表單時（POST方法），它發送輸入值（就像應該的那樣），但是它的純文本和Id希望對其進行加密，因此POST vars值不明顯。

但是，由於from值的輸出似乎來自javascript插件（滑塊），因此我不知道如何捕獲其值並在發送前對其進行加密。

我該如何進行以下工作：

value=<?php echo my_encrypt("", $key); ?>

其中“”是滑塊的值。

Answer 1

您將無法使用PHP加密值，因為它是服務器端技術。 您的加密將需要使用JavaScript進行。

我假設您有充分的加密理由，但是無論如何都要迅速提及：如果您通過HTTPS提交，則無需加密發送的值。 HTTPS已經這樣做了。

如果您不是通過HTTPS提交，則一種方法是從當前數字輸入中刪除該名稱，以使該名稱不會與表單一起提交，並保留第二個具有加密值的隱藏輸入，如下所示：

// the input box that shows the sliders value
<input type="number" id="select" size="2">
// the input that will store the encrypted value
<input type="hidden" name="select" value="">

然后，只要滑塊值發生變化，就對可見數輸入中的值進行加密並將其存儲在隱藏的輸入中（我假設由於您使用的是Foundation，因此可以使用jQuery）：

$(document).on('changed.zf.slider', '[data-slider]', function(event) {
  var $slider = $(event.currentTarget);
  var $numberInput = $slider.siblings('#select');
  var $hiddenInput = $slider.siblings('[name="select"]');
  var numberInputValue = $numberInput.val();
  var encryptedValue = yourEncryptionFunction(numberInputValue);

  $hiddenInput.val(encryptedValue);
});

提交表單后，將保存已存儲在隱藏輸入中的加密值，而可視數字輸入將被忽略，因為它沒有名稱屬性。