用jQuery问题分配变量_Jquery_Html_Forms

用jQuery问题分配变量

jquery html forms

用jQuery问题分配变量,jquery,html,forms,Jquery,Html,Forms,我试图使用jQuery组合用户的选择字段选项类别+贡献者，并将其插入id为as_q的隐藏字段中，但当我运行脚本时，as_q的值始终为空目前，当用户单击submit时，我调用该函数-它获取两个select字段的值并将其组合，然后再将其分配给as_q字段-至少这是我的逻辑也许我把钥匙放错地方了？我现在的代码如下。非常感谢您的帮助，谢谢 <form action="<? echo $PHP_SELF;?>" method="get" id="cse-search-box">

我试图使用jQuery组合用户的选择字段选项类别+贡献者，并将其插入id为as_q的隐藏字段中，但当我运行脚本时，as_q的值始终为空

目前，当用户单击submit时，我调用该函数-它获取两个select字段的值并将其组合，然后再将其分配给as_q字段-至少这是我的逻辑

也许我把钥匙放错地方了？我现在的代码如下。非常感谢您的帮助，谢谢

<form action="<? echo $PHP_SELF;?>" method="get" id="cse-search-box">
  <input type="text" name="q" size="31"/>
  <select name="category">
    <option>Movies</option>
    <option>Film</option>
    <option>Fashion</option>
  </select>
  <select name="contributors">
    <option>One</option>
    <option>Two</option>
    <option>Three</option>
  </select>
  <input type="hidden" name="as_q" id="as_q" value="" />
  <input type="submit" name="sa" value="Search" id="submit_query" />
</form>

<script>      
  $('#submit_query').click(function (){
    var category = $('[name=category]').val();
    var contributors = $('[name=contributors]').val();

    $('[#as_q]').val(category+' '+contributors);

  }); 
</script>

只是一个猜测-摆脱方括号从

$('[#as_q]').val(category+' '+contributors);

不要用方括号括起来。另外，不要在单击提交按钮时执行此操作。这并不能捕获表单提交的所有方式。而是在表单提交事件中执行此操作：

$("#cse-search-box").submit(function() {
  var category = $('[name=category]').val();
  var contributors = $('[name=contributors]').val();
  $('#as_q').val(category+' '+contributors);
});

注意：在某些浏览器上，调用form.submit也会绕过此处理程序，但无论如何都会绕过您的单击事件。

除了其他建议外：

1-将代码放入$document中。准备好了吗。。。块这可能就是它不起作用的原因

2-为更好的性能提供选择ID，例如[name=blah]不是选择元素的最快捷方式

$(document).ready(function() {
    $('#submit_query').click(function (){
        var category = $('#category').val();
        var contributors = $('#contributors').val();
        $('#as_q').val(category + ' ' + contributors);
    });  
});

下面是我正在使用的测试代码，它会使您的代码对我来说运行良好

该文件名为sandbox.php，我提到这一点是因为唯一真正未知的是您是否为文件提供了.php扩展名

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<!-- Above Doctype should provide S mode in Moz, Safari, Opera, IE8 and A (almost standards) in IE6/7 -->
<head>
  <meta http-equiv="Content-Type" content="application/text+html;utf-8">

  <title>Sandbox</title>
  <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet">
  <script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>
  <script src="http://dev.jquery.com/view/tags/ui/latest/ui/effects.core.js"></script>

<script type="text/javascript">
    $(document).ready(function() {
  $('#submit_query').click(function (){
    var category = $('[name=category]').val();
    var contributors = $('[name=contributors]').val();

    $('#as_q').val(category+' '+contributors);
  }); 
    });

</script>
</head>
<?php
if(isset($_REQUEST['as_q'])) {
    echo $_REQUEST['as_q'];
}
?>
<body class="calendarPage">
<form action="#" method="get" id="cse-search-box">
  <input type="text" name="q" size="31"/>
  <select name="category">
    <option>Movies</option>
    <option>Film</option>
    <option>Fashion</option>
  </select>
  <select name="contributors">
    <option>One</option>
    <option>Two</option>
    <option>Three</option>
  </select>
  <input type="hidden" name="as_q" id="as_q" value="" />
  <input type="submit" name="sa" value="Search" id="submit_query" />
</form>


    </body>


</html>

我在提交问题后意识到了这一点，但这不是问题所在，thanksI最初是这样做的，但这似乎也不起作用。两种方式都是空的……我不是专家，所以在这里无所适从！感谢您的建议，我现在正在使用ID选择器。我已经将代码包装到doc ready块中，但是仍然没有运气-真的很困惑为什么这不起作用！将代码放入测试页会使其在FF3.5中运行良好。您能提供更多详细信息吗？我自己在部署服务器之外尝试了一个测试页面，但也无法正常工作-我正在查看url中的as_q部分，该部分为空。我可以问一下，您是如何测试这两个字段是否已合并到as_q中的？也许这会帮助我提供一些更准确的信息？我真的建议使用pastehtml.com来回答这样的问题。好的，谢谢-在开发服务器上使用您的代码，一切正常。据我所知，我的代码和你的代码之间的唯一区别是我为-1.2.6开发的站点上使用的jQuery版本。我不知道两个版本之间的区别，但我不会认为这是问题所在？除非包含的jquery（存储在本地服务器上）已被编辑？我要去调查，并试图得到更多的信息！