0

私のサイトで使用しているフォームがあり、簡単な JQuery 検証で検証されています。問題は、値を変更しても実際には何も送信または実行されないことです。これが私のコードです：

<form id="radForm" method="post" action="events.php?type=rad">
    <div class="searchBoxLeft searchBoxRad"></div>
    <div class="searchBoxMiddle">
        <input id="radSearch" type="text" class="searchBoxInput searchBoxShort" value="<?php echo $yourradius; ?>" />
        <label class="searchBoxLabel">Mile Radius of Your Address</label>
    </div>
    <div id="radButton" class="searchBoxRight"></div>
    <div class="clearLeft"></div>
</form>

<script>
    $(document).ready(function()
    {
        var radsearchok = 0;
        //Rad search
        $('#radSearch').blur(function()
        {
            var radsearch=$("#radSearch").val();
            if(radsearch < 2){
                $('#radSearch').addClass("searchError");
                radsearchok = 0;
            }
            else if(radsearch > 50){
                $('#radSearch').addClass("searchError");
                radsearchok = 0;
            }
            else{
                $('#radSearch').addClass("searchSuccess");
                radsearchok = 1;
            }
        });
        // Submit button action
        $('#radButton').click(function()
        {
            if(radsearchok == 1)
            {            
                $("#radForm").submit();
            }
            else
            {
                $('#radSearch').addClass("searchError");
            }
            return false;
        });
        //End
    });
</script>

誰でもこれの何が悪いのか分かりますか?

4

2 に答える 2

0

以下で説明するコード（ http://jsfiddle.net/zdeZ2/2/ ）にいくつかの変更を加えました。

<div id="radButton" class="searchBoxRight"></div>私はあなたがそこに何かを持っていると仮定します=><input id="radButton" class="searchBoxRight" type="button" value="rad button">

次のように、ぼかしを使用してバリデーターを書き直しました。示唆されているように、比較の前に radSearch 値を整数に変更します。変更により、検証前にsearchErrorおよびsearchSuccessクラスが削除されます。また、いくつかの最適化も行いました。

//Rad search
$('#radSearch').blur(function () {
    //remove classes from previous validating
    var $this = $(this).removeClass("searchError").removeClass("searchSuccess");
    var radsearch = $this.val() | 0; //radsearch is an integer
    if (radsearch < 2 || radsearch > 50) {
        $this.addClass("searchError");
        radsearchok = 0;
    } else {
        $this.addClass("searchSuccess");
        radsearchok = 1;
    }
});

同等に次のように記述できます。

//Rad search
$('#radSearch').blur(function () {
    var $this = $(this);
    var radsearch = $("#radSearch").val() | 0; //radsearch is an integer
    var valid = radsearch < 2 || radsearch > 50;

    $this.toggleClass("searchError", !valid)
        .toggleClass("searchSuccess", valid);
    radsearchchok = valid ? 1 : 0;
});
于 2013-10-23T15:05:10.477 に答える