JQuery এর সাথে 'এন্টার' তে একটি ফর্ম জমা দিচ্ছেন?


427

আমার কাছে একটি বোগ-স্ট্যান্ডার্ড লগইন ফর্ম রয়েছে - একটি ইমেল পাঠ্য ক্ষেত্র, একটি পাসওয়ার্ড ক্ষেত্র এবং এইচআইএমএল / জিকুয়েরি ব্যবহার করে এমন একটি বায়ু প্রকল্পে একটি জমা বোতাম। আমি যখন ফর্মটিতে এন্টার চাপি তখন পুরো ফর্মের বিষয়বস্তু লোপ পায়, তবে ফর্মটি জমা দেওয়া হয়নি। কেউ কি জানেন যে এটি ওয়েবকিট সমস্যা (অ্যাডোব এআইআর এইচটিএমএল-এর জন্য ওয়েবকিট ব্যবহার করে), বা আমি জিনিসগুলি গুছিয়ে রেখেছি?

আমি চেষ্টা করেছিলাম:

$('.input').keypress(function (e) {
  if (e.which == 13) {
    $('form#login').submit();
  }
});

তবে এটি উভয়ই সাফ করার আচরণ বন্ধ করে দেয়নি বা ফর্মটি জমা দেয়। ফর্মের সাথে কোনও পদক্ষেপ নেই - এটি কি সমস্যা হতে পারে? আমি কি জাভাস্ক্রিপ্ট ফাংশনটি ক্রিয়াতে রাখতে পারি?


3
আপনার <ইনপুট ... এ সত্যই কি আপনার কাছে কোনও শ্রেণি = "ইনপুট" গুণ আছে? দেখে মনে হচ্ছে এটি $ ('ইনপুট') হওয়া উচিত
ke কীপ্রেস

ক্লাসগুলি একটি সিএমএস দ্বারা প্রোগ্রামগতভাবে উত্পন্ন হয়। তবে এটির পরিবর্তে $ ('ইনপুট') এ স্কোপ করা পৃষ্ঠার প্রতিটি ইনপুটকে প্রভাবিত করবে, আমি আচরণটি চাই কি না তা নির্বিশেষে। দুঃখিত এটি আপনার সংবেদনগুলি ক্ষুন্ন করে।
হোলেনবেক

15
সংবেদনগুলি কমপক্ষে বিরক্ত হয় না। কেবল ভেবেছিলাম এটি সম্ভবত একটি পর্যবেক্ষণ হতে পারে যা সমস্যার দিকে পরিচালিত করে। চালিয়ে যান
NexusRex

1
এফওয়াইআই: আপনার গৃহীত উত্তর সম্পূর্ণ সঠিক নয়। নীচে আমার উত্তর দেখুন।
NoBrainer

উত্তর:


399
$('.input').keypress(function (e) {
  if (e.which == 13) {
    $('form#login').submit();
    return false;    //<---- Add this line
  }
});

এই স্ট্যাকওভারফ্লো উত্তরটি দেখুন: ইভেন্ট.প্রিভেন্টডিফল্ট () বনাম মিথ্যা ফেরত দিন

মূলত, "রিটার্ন মিথ্যা" কলিং e.preventDefaultএবং এর মতোই e.stopPropagation()


3
নোট করুন তারা এক নয়। আইই 8 এর কোনও e.preventDefault নেই। আইই 8-এর জন্য ইভেন্ট.রেটানভ্যালু = মিথ্যা ব্যবহার করুন;
এমবোকিল

8
@ এমবোকিল বাদে jQuery ব্যবহার করার সময়, আইই 8 তে এটি একই রকম। এবং আই 7। এবং আই 6।
কেভিন বি

আপনি যদি প্রথমে ইনপুট ক্ষেত্রগুলিতে টাইপ করতে চান তবে "মিথ্যা প্রত্যাবর্তন করুন" রাখুন; যদি বিবৃতি ভিতরে।
জুনি ব্রোসাস

173

জেসন কোহেন উল্লিখিত হিসাবে মিথ্যা ফেরত ছাড়াও। আপনাকে ডিফল্টও আটকাতে হবে

e.preventDefault();

13
যেমনটি নোব্রাইনার বলেছেন, এটি ভুল: return falsejQuery দ্বারা পরিচালিত একটি ইভেন্টে স্বয়ংক্রিয়ভাবে e.preventDefault () কল করুন
রিকার্ডো গ্যালি

83

এটি সাহায্য করবে কিনা তা জানেন না তবে আপনি সরাসরি ফর্মটি জমা দেওয়ার পরিবর্তে সাবমিট বাটন ক্লিকের অনুকরণের চেষ্টা করতে পারেন। আমার প্রোডাক্টে নিম্নলিখিত কোড রয়েছে এবং এটি ঠিকঠাক কাজ করে:

    $('.input').keypress(function(e) {
        if(e.which == 13) {
            jQuery(this).blur();
            jQuery('#submit').focus().click();
        }
    });

নোট: । JQuery এর ( '# জমা') ফোকাস () যখন প্রবেশ টেপা হলে বোতাম সজীব করে তোলে।


2
দুর্দান্ত কাজ করে তবে আমাকে "মিথ্যা প্রত্যাবর্তন" যুক্ত করতে হয়েছিল; ডাবল ফর্ম জমা রোধ করতে।
90

কর্মরত | ট্রিগার, সেন্ডকি, ইত্যাদি, দোহ, বালা ... সম্পর্কে কথা বলার মতো প্রচুর ফলাফল দেখুন, তবে এটি আমার পক্ষে একমাত্র কাজ এবং সত্যিই একটি বোতামে ক্লিক পাঠান। জমা দিন না ()। সুতরাং, কৌশলটি ফোকাস ছিল ()। ধন্যবাদ.
m3nda

কাজ করে, তবে আমাকে এই কোডটি নীচে রাখতে হয়েছিল: $ (ডকুমেন্ট) .ডিডি (ফাংশন () {...
শশী কাঁথ


30

এন্টার কীটির জন্য আপনাকে হুক করে পরীক্ষা করতে হবে এমন কোনও কারণ আছে?

আপনি কেবল একটি যোগ করতে পারেন না

<input type="submit" /> 

আপনার ফর্মটিতে এবং প্রবেশটি ধাক্কা দেওয়ার সময় এটি স্বাভাবিকভাবে জমা দেওয়া উচিত? তারপরেও আপনি ফর্মটির onsubmitক্রিয়াটি হুক করতে পারেন এবং আপনি চাইলে সেখান থেকে একটি বৈধতা ফাংশন কল করতে পারেন ...

এমনকি onsubmitআপনার ফর্মটি জমা দেওয়া হচ্ছে কিনা তা দেখতে আপনি এটি পরীক্ষার হিসাবেও ব্যবহার করতে পারেন, তবে আপনি কল করলে এটি কাজ করবে না form.submit()


1
সম্পূর্ণ একমত. আমার অগ্রাধিকারটি সর্বদা ব্রাউজারের স্থানীয় কার্যকারিতা (প্রকারের ইনপুট = স্থানীয়ভাবে প্রবেশের কী প্রেসে স্থানীয়ভাবে প্রতিক্রিয়া জানানো) ব্যবহার করার পরিবর্তে আরও ক্ল্যাজড স্ক্রিপ্টগুলি যুক্ত করা হবে ..
হারুন

1
সমস্যাটি হল, আপনি যদি এজাক্স স্টাফ করছেন এবং সার্ভারটিতে একটি সত্যিকারের পোস্টব্যাক না পাওয়া যায়, তবে আপনি কীভাবে ইউআইর প্রত্যাশা অনুযায়ী ইউআই আচরণ করতে চান?
devlord

প্রকৃতপক্ষে ... আমি পুরো return false;বিষয়টি উপেক্ষা করেছিলাম
devlord

14

এখানে জিকুয়েরি প্লাগইন হিসাবে করার একটি উপায় রয়েছে (আপনি যদি কার্যকারিতাটি পুনরায় ব্যবহার করতে চান):

$.fn.onEnterKey =
    function( closure ) {
        $(this).keypress(
            function( event ) {
                var code = event.keyCode ? event.keyCode : event.which;

                if (code == 13) {
                    closure();
                    return false;
                }
            } );
    }

এখন আপনি যদি <input>এই ধরণের কার্যকারিতা সহ কোনও উপাদানটি সাজাতে চান তবে এটি এর চেয়ে সহজ simple

$('#your-input-id').onEnterKey(
    function() {
        // Do stuff here
    } );

12

আপনি onsubmit="return false"ডিফল্ট আচরণ রোধ করার জন্য পৃষ্ঠায় ফর্ম কোডটিতে কেবল যুক্ত করতে পারেন ।

তারপরে জাভাস্ক্রিপ্ট ফাইলে jQuery সহ যে কোনও ফাংশনে ফর্মের ইভেন্টটি হুক করুন ( .bindবা .live) submit

সহায়তার জন্য এখানে একটি নমুনা কোড রয়েছে:

এইচটিএমএল

<form id="search_form" onsubmit="return false">
   <input type="text" id="search_field"/>
   <input type="button" id="search_btn" value="SEARCH"/>
</form>

জাভাস্ক্রিপ্ট + jQuery

$(document).ready(function() {

    $('#search_form').live("submit", function() {
        any_function()
    });
});

এটি ফায়ারফক্স 4.0.০ এবং জিকুয়েরি ১.৪.৩ সহ ২০১১-০৪-১৩ হিসাবে কাজ করছে


এটি ক্রোমে কাজ করে না। যাইহোক জমা দেবে।
মার্সেলো আগিমিভেল

5

এটি আমার কোড:

  $("#txtMessage").on( "keypress", function(event) {
    if (event.which == 13 && !event.shiftKey) {
        event.preventDefault();
        $("#frSendMessage").submit();
    }
    });

4

অ্যাক্সেসযোগ্যতা বজায় রাখার জন্য, আপনার কীকোড নির্ধারণ করতে আপনার এটি ব্যবহার করা উচিত:

c = e.which ? e.which : e.keyCode;

if (c == 13) ...

3

সহজ বাস্তবায়নের জন্য কেবল যোগ করা হচ্ছে। আপনি কেবল একটি ফর্ম তৈরি করতে পারেন এবং তারপরে জমা দেওয়া বোতামটি লুকিয়ে রাখতে পারেন:

উদাহরণ স্বরূপ:

<form action="submit.php" method="post">
Name : <input type="text" name="test">
<input type="submit" style="display: none;">
</form>

@ এসবিরসি এবং আপনার ক্রোমটি কোন সংস্করণ? আমি ল্যাপটপ থেকে পিসি পর্যন্ত পরীক্ষা করেছি এবং আমার কোডটি কেবল কার্যকর। আমার উত্তরটি চিহ্নিত করার আগে আপনি নতুন ক্রোমটি ডাউনলোড করার চেষ্টা করুন।
জোয়েম মারানান

2

আমি এখন ব্যবহার

$("form").submit(function(event){
...
}

প্রথমে আমি জমা দেওয়ার বোতামে একটি ইভেন্ট হ্যান্ডেলার যুক্ত করেছি যা আমার জন্য ত্রুটি তৈরি করেছিল।


1

আমি আজ জানতে পেরেছি কী কী টিপুন ইভেন্টটি এন্টার কী টিপে আঘাত করা হয় না, তাই আপনি পরিবর্তে কীডাউন () বা কীআপ () এ স্যুইচ করতে চাইতে পারেন।

আমার পরীক্ষার লিপি:

        $('.module input').keydown(function (e) {
            var keyCode = e.which;
            console.log("keydown ("+keyCode+")")
            if (keyCode == 13) {
                console.log("enter");
                return false;
            }
        });
        $('.module input').keyup(function (e) {
            var keyCode = e.which;
            console.log("keyup ("+keyCode+")")
            if (keyCode == 13) {
                console.log("enter");
                return false;
            }
        });
        $('.module input').keypress(function (e) {
            var keyCode = e.which;
            console.log("keypress ("+keyCode+")");
            if (keyCode == 13) {
                console.log("Enter");
                return false;
            }
        });

কীবোর্ডে "এন্টার বি" টাইপ করার সময় কনসোলের আউটপুট:

keydown (65)
keypress (97)
keyup (65)

keydown (13)
enter
keyup (13)
enter

keydown (66)
keypress (98)
keyup (66)

আপনি দ্বিতীয় ক্রমটিতে দেখেন যে 'কীপ্রেস' অনুপস্থিত, তবে কীডাউন এবং কীআপ রেজিস্টার কোড '13' টিপে / প্রকাশিত হয়েছে as হিসাবে প্রতি ফাংশন কী টেপার সময় jQuery এর ডকুমেন্টেশন () :

Note: as the keypress event isn't covered by any official specification, the actual behavior encountered when using it may differ across browsers, browser versions, and platforms.

আইই 11 এবং এফএফ 61 তে সার্ভার 2012 আর 2 এ পরীক্ষিত


0

এইচটিএমএল কোডগুলিতে:

<form action="POST" onsubmit="ajax_submit();return false;">
    <b>First Name:</b> <input type="text" name="firstname" id="firstname">
    <br>
    <b>Last Name:</b> <input type="text" name="lastname" id="lastname">
    <br>
    <input type="submit" name="send" onclick="ajax_submit();">
</form>

জেএস কোডগুলিতে:

function ajax_submit()
{
    $.ajax({
        url: "submit.php",
        type: "POST",
        data: {
            firstname: $("#firstname").val(),
            lastname: $("#lastname").val()
        },
        dataType: "JSON",
        success: function (jsonStr) {
            // another codes when result is success
        }
    });
}

1
দয়া করে একাধিক প্রশ্নের একই রকম উত্তর পোস্ট করবেন না। একটি ভাল উত্তর পোস্ট করুন, তারপরে অন্য প্রশ্নগুলিকে সদৃশ হিসাবে বন্ধ করতে ভোট / পতাকা দিন। যদি প্রশ্নটি সদৃশ না হয় তবে আপনার প্রশ্নের উত্তরগুলি শিখুন।
পল রাউব

@ পলরউব আমার উত্তরটির সাথে অন্যটির কিছুটা পার্থক্য রয়েছে।
mghhgm

এই উত্তরটি এই বা এটি থেকে আলাদা কীভাবে ?
পল রাউব

@ পলরউব আমার এই সমস্যাটি রয়েছে এবং এর জন্য প্রথমে গুগল অনুসন্ধান করুন। এই পৃষ্ঠাগুলি, এই সমস্যাটি সম্পর্কে কথা বলুন তবে সহজ নয়। যখন আমি সেরা উত্তর পাই, তখন আমি এই পৃষ্ঠাগুলিতে এটি ভাগ করে নেওয়ার সিদ্ধান্ত নিয়েছি যখন এটি অনুসন্ধান করার সময় ব্যবহারকারীদের সহায়তা করতে হবে, কিছু অনুরূপ স্ট্যাকওভারফ্লো পৃষ্ঠায় আমার উত্তর দেখুন।
mghhgm

1
এই উত্তরটি একেবারেই প্রশ্নের সাথে সম্পর্কিত নয়
জোল্টন সেল

-4

এটা চেষ্টা কর:

var form = document.formname;

if($(form).length > 0)
{
    $(form).keypress(function (e){
        code = e.keyCode ? e.keyCode : e.which;
        if(code.toString() == 13) 
        {
             formsubmit();
        }
    })
}

9
এটি অস্বস্তিকর উপায়ে ভ্যানিলা জাভাস্ক্রিপ্টের সাথে জ্যাকোরি মিশ্রিত করছে এবং এতে সত্যই এক বিজোড় কাস্ট রয়েছে যা কেবল জিনিসগুলিকে বিভ্রান্ত করে
moopet
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.