Question

我有一个愚蠢的问题。

根据div的可见性，我想设置隐藏值

if($('#crewMember').is(':visible')) {
  $('#visibility').attr('value', 'hidden')
} else {
  $('#visibility').attr('value', 'visible')
}

这很有效。我通过FireBug检查了它，我可以看到HTML已经改变了。

但是当我在表单提交后尝试获取此值时，我得到原始值，而不是更改的值。

echo $_POST['visibility']
//returns default value, not the adjusted valueHow come?

怎么回事？

修改 SOme示例代码

<html>
    <script type="text/javascript">
       $(document).ready(function() {

    $('#div').click(function() {
      $('#visibility').val('hidden');
      $('#value').html('hidden value: ' + $('#visibility').val());
    });

    $('#value').html('hidden value: ' + $('#visibility').val());
  });

  <body>
        <form method="post">
            <div id="div">
                click this area to change value
            </div>

            <div id="value"> <!-- This div will show the actual value of the hidden field -->
            </div>
            <input type="hidden" id="visibility" name="visibility" value="initial value" />
            <input type="submit" name="button" value="button" />
        </form>
    </body>
</html>

当我提交此表单时，$ _POST ['visibility']始终包含字符串'initial value'。即使我将JS的值更改为“隐藏”;

Answer 1

尝试使用val()代替（假设您的visibility元素是输入元素）：

if($('#crewMember').is(':visible')) {
  $('#visibility').val('hidden');
} else {
  $('#visibility').val('visible');
}

Answer 2

正如ManseUK所说，将$("").attr('value',...)更改为$("").val(...)（请参阅jQuery documentation for .val）

但是要回答关于 why 的问题，您需要了解DOM对象在JavaScript中的工作原理。对于每个元素（div，p，a，img，form，input， ......），每个元素都是DOM中的一个对象。

以下是重要部分：元素有一个值，但每个属性都有一个值。在jQuery中，当你使用.attr('value',...)时，你真正在做的是创建一个名为“value”的属性。但是这不会改变元素值，它保持不变。

在firebug中，它会读取JavaScript属性并将其分层放在元素之上，这就解释了为什么它在firebug中以这种方式出现。但是，当需要将数据提交给服务器时，浏览器将不会提交属性值 - 仅提供元素的值（未更改）。但是使用.val()将更改元素值，该值将提交给服务器。

也许这会在原始JavaScript中更有意义，而不是jQuery：

相当于.attr()：element.setAttribute("value","...");

相当于.val()：element.value = "...";

你看到了区别吗？在.attr()中，您从未更改过值，只更改了属性。

改变价值JS，PHP获得旧价值

2 个答案: