将数据从 javascript 发送到 html 并使用 php 获取

Posted

技术标签:

【中文标题】将数据从 javascript 发送到 html 并使用 php 获取【英文标题】:Send data from javascript to html and fetch with php 【发布时间】:2015-04-22 02:11:12 【问题描述】:

好的,我不知道这是否是正确的做法。如果没有,请给我一个如何做的例子。如何获取 JS 中的数据并将其发送到 html

JS

$(document).ready(function() 
var choosenYear = $('#choose_year');
$("#choose_year").select2(
    data: [
        id: 0,
        text: '2015'
    , 
        id: 1,
        text: '2014'
    ],
    val: ["0"]
).select2('val', 0);

// Start Change
$(choosenYear).change(function() 
    var choosenYear = $(choosenYear).select2('data').id;
    $('#choosen_year').val(choosenYear);
 ); //Change
);

HTML

<form class="form-inline well col-md-8" id="form-choose_usr" action="#" method="post" enctype="multipart/form-data">
//This is what i POST
<div>
  <input type='hidden' class='col-md-4' id='choose_usr_email' name='choose_usr_email'>
 </div>
 <!-- Select2 choose_year -->
 <div>
 <input type='hidden' class='col-md-2' id='choose_year' name='choose_year'>
 </div>
 <!-- Select2 choose_month -->
 <div>
<input type='hidden' id='choosen_year' name='choosen_year'>
<input type="submit" class="btn btn-info pull-right" value="Hämta" />

PHP

//And this is how i fetch it
$posted_choosen_year = $_POST['choosen_year'];
echo $posted_choosen_year;

【问题讨论】:

php 中,如果 js 语法正确并且您的 INPUT 被指向您的 php 的表单标签包围,您现在可以输出类似 echo "Chosen year: " . $posted_chosen_year; 的变量。 这个我知道,但是js不对!? 这取决于您在 JS 中到底在做什么。看起来你有一个选择框、下拉列表或其他东西?或者所选年份的数据来自哪里? @Eddi 我使用 Select2 下拉菜单。显示的选项是:2015 和 2014,它在 JS 中列出。 @Daniel 我的变量为空,没有回显 【参考方案1】:

jquery change 函数不是propper事件:

$("#choosenYear").on("select2:select", function (e)  do stuff here... );

会的。有关更多信息,请参阅“事件”下的 http://select2.github.io/examples.html。还有一些运行示例将提供如何使用这个东西。

我纠正了你的小提琴并让它运行:

$(document).ready(function() 
    function log(text) 
        $('#chosen_year').append(text + '<br>');
    

$('#choose_year').select2()
    .on("change", function(e) 
        log(this.value);
    ) 
);

【讨论】:

我试过这个:jsfiddle.net/8byz7n25 它在我的服务器上工作,但在小提琴中它说“未定义”?! 谢谢,但我真的不知道如何使用“事件”来填充 php 变量。事件适用于“Div”,但不适用于“Span”或“Input”。 得到了那个运行,见上文。 e.val,你从哪里得到的?【参考方案2】:

所以,我真的不知道如何解决它。所以我将代码更改为具有静态 HTML 值,而不是将值存储在 JS 文件中。

HTML

<form class="form-inline well col-md-8" id="form-choose_usr" action="#" method="post" enctype="multipart/form-data">
  <select class="col-md-4" id="choose_year" name="choose_year" required>
    <option></option>
    <option value="2015">2015</option>
    <option value="2014">2014</option>
  </select>
  <input type="submit" class="btn btn-info pull-right" value="Hämta" />
</form>

JS

$(document).ready(function()
  $('#choose_year').select2(
    placeholder: 'Välj år..',
    minimumResultsForSearch: -1
  );
);

PHP

$posted_chosen_year = $_POST['choose_year'];
echo $posted_chosen_year;

【讨论】:

【参考方案3】:

好的,使用我刚刚创建的这个小提琴进行测试:http://jsfiddle.net/yL6g087x/1/

如果显示该对象

$("#choosenYear").select2("data")

不存在...所以我想我会查阅手册.. rtm.. 他们的例子失败了.. 在两个层面上.. 他们的小提琴:http://jsfiddle.net/platypusman/xDUUg/

首先为 js 和 css 文件返回 404...所以我链接了它们当前的文件..该示例仍然无法工作..看起来 select2 插件在其当前版本上已损坏..

我可能是错的,但这是我从他们提供的示例中发现的

【讨论】:

很奇怪..当我将它与 ajax 调用一起使用以获取数据时,它可以正常工作! 如果您能给我一个工作示例,您可以在其中读取所选项目的值.. 就像在 id 中一样,而不是文本值。然后我会快速浏览一下,应该可以合并 em jsfiddle.net/p5ajkdzq 如果您输入 url 并使用 php 获取数据,则此代码有效 您在上面粘贴的小提琴使用 ajax 和 json 作为数据类型,它不使用标准数据属性。 是的,我知道。我在从 mysql 获取数据时使用它抛出了一个后端 PHP 脚本。但是在JS中存储数据时应该是simular。

以上是关于将数据从 javascript 发送到 html 并使用 php 获取的主要内容,如果未能解决你的问题,请参考以下文章

将数据从 JavaScript 发送到服务器到 PHP,得到 500 错误

Django 将数据发送到 Javascript 文件

如何将数据从html发送到节点js?

如何使用ajax将数据从视图发送到控制器laravel?

如何使用 JavaScript 将 JSON 文件从 HTML 页面发送到 ESP

我可以使用 JavaScript 将对象从一个 html 页面发送到另一个页面吗