简体   繁体   English

jQuery焦点/模糊$ _GET ['variable']冲突

[英]jQuery focus / blur $_GET['variable'] conflict

I have a simple focus / blur. 我有一个简单的焦点/模糊。 'Name of Venue' is shown by default since it's the value of the input type. 默认情况下会显示“地点名称”,因为它是输入类型的值。 on 'focus' it hides and on 'blur' is shows again if there's no text. 如果没有文字,则将其隐藏在“焦点”上,并再次显示在“模糊”上。

Here's the input field 这是输入字段

<input type="text" name="name" id="search_name" value="Name of Venue" maxlength="100" />

Here's the jQuery 这是jQuery

$('#search_name').focus(function() {
  if($(this).val() == 'Name of Venue') {
    $(this).val('');
  }
});

$('#search_name').blur(function() {
  if($(this).val() == '') {
    $(this).val('Name of Venue');
  }
});

On submit I don't want 'Name of Venue' to be stored as the get variable for $_GET['name'] . 在提交时,我不希望将“地点名称”存储为$_GET['name']的get变量。 So, I'm doing <br /><br /> PHP 所以,我在做<br /><br /> PHP

if($_GET['name'] === 'Name of Venue') {
  $_GET['name'] = '';
}

But, this doesn't work. 但是,这不起作用。 How can I make it so the get variable will be empty on submit if it's the default value? 我如何才能做到,如果它是默认值,则get变量在提交时将为空?

Consider using the HTML5 placeholder attribute if possible. 如果可能,请考虑使用HTML5 占位符属性。 The value will be blank if nothing was entered. 如果未输入任何内容,则该值为空白。

<input type="text" name="search_name" id="search_name" placeholder="Name of Venue" maxlength="100" />

It will appear/disappear automatically, so you won't need the focus/blur code. 它会自动显示/消失,因此您不需要焦点/模糊代码。 Also, "name" is a bad name for name , I'd use something more unique (usually the id will do). 另外,“ name”对于name是一个不好的name ,我会使用更独特的名称(通常id可以)。

As an alternative, you could do this: 或者,您可以执行以下操作:

<form id="myform" method="get" action="">
    <input type="text" name="search_name" id="search_name" value="Name of Venue" maxlength="100" />
    <input type="submit" id="submit_button" value="Submit" />
</form>

<script src="jquery-1.7.1.min.js"></script>
<script>
    // ready() not need if <script> follows content, but best to put this in a .js file and link in <head>
    $(document).ready(function() {
        // Define once and you're good
        var search_name = $('#search_name');
        var submit_button = $('#submit_button');
        var search_default = 'Name of Venue';

        search_name.focus(function() {
            if($(this).val() == search_default) {
                $(this).val('');
            }
        });

        search_name.blur(function() {
            if($(this).val() == '') {
                $(this).val(search_default);
            }
        });

        $("#myform").submit(function(event) {
            if (search_name.val() == '' || search_name.val() == search_default) {
                event.preventDefault(); 
            } else {
                return true;
            }
        });
    });
</script>

<?php
    var_dump($_GET);
    $name = '';
    if (isset($_GET['search_name'])) {
        // Without the check, we might run query when none exists
        $name = $_GET['search_name'];
        $name = $name != 'Name of Venue' ? $name : '';
    }
    var_dump($name);
?>

This will prevent a submit with a blank or default name. 这样可以防止使用空白名称或默认名称进行提交。 It's probably handy to put any repeated logic in a function and call those when handling the GET in PHP with any extra search variables. 将任何重复的逻辑放入函数中并在使用额外的搜索变量处理PHP中的GET时调用它们可能很方便。

I think you have to make the field value blank before submitting the form if value is Name of Venue . 我认为如果value是Name of Venue则必须在提交表单之前将字段值留空。

$('#frName').submit(function() {  if($('#search_name').val() == 'Name of Venue' ){ $('#search_name').val('') } return false;});

You can remove return false if you want to submit the value. 如果要提交值,可以删除return false。 Hope its helps you 希望它对您有帮助

You can control the value on client side and if it's a required field don't let the form to be submitted. 您可以在客户端控制该值,如果这是必填字段,则不要提交表单。 If it's not required, just set the value to "" if it is "Name of Venue". 如果不是必需的,则将其设置为“场地名称”即可将其设置为“”。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM