3

如何获取表单中的范围滑块的值?

我无法通过仅从名称中获得价值。

我使用这个 JavaScript 函数在滑块旁边的表单中输入值

    function showValue(newValue)    {
    document.getElementById("range").innerHTML=newValue;    }

我可以从 div 或类似的地方打电话吗?

编辑! 好的,我们开始吧,如果我让大家感到困惑,我很抱歉,但英语不是我的母语。我会尝试解释。

我有一个 HTML5 的联系表单,将数据提交到mail.php.

<input type="text" name="name"/>
<input type="email" name="email"/>

mail.php我从输入框中获取值

$name = $_POST['name'];
$email = $_POST['email'];

然后进一步处理以发送实际邮件。

到现在为止还挺好?

我有一个范围滑块,可以确定用户想要预订多少乘客。

<input type="range" min="1" max="12" step="1" value="1" name="passengers" onchange="showValue(this.value)" />
<span id="range">1</span></p></div>

我使用 JavaScript 函数是因为我想在用户浏览表单时向用户显示当前选择的滑块值。

但我自己当然也想在mail.php发送邮件中加入这个值。我无法从范围名称中请求值。所以我想知道我是否可以从 div id 范围内访问值或其他什么?

4

2 回答 2

8

因此,您需要一个滑块,它在自身旁边显示其当前值,当提交表单时,您的操作文件 (mail.php) 获取/检索滑块的选定值以进一步处理。对??

我相信这是因为:

您为您的问题命名Send HTML 5 range slider value to mail via php,我将其解释为 How to get the value of this range-slider in mail.php.

您说您通过对输入文本框执行 $_POST["foo"] 来获取输入文本框的值。

因此,同样地,Range Slider 的值也可以在$_POST数组中使用。我假设您正在使用action=POST,因为您提到$name = $_POST['name']

因此,要获取此特定 Range Slider 的值,请使用:

$range_slider_value = $_POST["passengers"];

当然,您应该考虑清理表单输入和所有其他类型的外部输入。

一个功能齐全的片段,它在用户的计算机上显示值,当他/她更改滑块和表单提交时,将其提供给您的 mail.php 是:

<form action="" method="POST">
    <input type="range" min="1" max="12" step="1" value="1" id="foo" name="passengers" onchange='document.getElementById("bar").value = "Slider Value = " + document.getElementById("foo").value;'/>
<input type="text" name="bar" id="bar" value="Slider Value = 1" disabled />
<br />
<input type=submit value=Submit />
</form>

<?php
if(isset($_POST["passengers"])){
    echo "Number of selected passengers are:".$_POST["passengers"];
    // Your Slider value is here, do what you want with it. Mail/Print anything..
} else{
Echo "Please slide the Slider Bar and Press Submit.";
}
?>

Codepad.viper-7.com 上的现场演示

引用http://www.html5tutorial.info/html5-range.php
Value is a common attribute of "Input" element. The value can be any valid floating point number, not necessary must be an integer number. Default value is minimum value plus half of the maximum value.

不要将 Javascript 功能与 PHP 功能混淆。PHP 在服务器端工作,一旦生成页面就无法更改任何内容。Javascript 在客户端工作,即使在呈现后也可以更改页面。

你说if maybe I could access the value from the div id range or something..
在 jQuery 中,可以获取 a 的值Div并可以与表单数据一起提交,但你不需要走那条路。一个简单的$_POST["passengers"];就可以了。

于 2012-08-03T12:44:56.267 回答
-1

document.getElementById("range").value应该得到滑块的当前值。

要更改该值,这将是 javascript.code;

function showValue(newValue) {
    document.getElementById("range").value = newValue; }

如果您通过 PHP 渲染滑块,您可以直接插入值:

<input id="range" type="range" value="<?$theValue?>"/>
于 2012-08-03T01:44:50.450 回答