জেকুয়েরি জাভাস্ক্রিপ্ট এঙ্গুলার এইচটিএমএল সিএসএস বুটস্ট্রাপ
লগইন
 

জেকুয়েরি ajax()মেথড


উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("button").click(function(){
        $.ajax({url: "demo_ajax_load.txt", async: false, success: function(result){
            $("div").html(result);
        }});
    });
});
</script>
</head>
<body>

<div><h2>আজাক্সের মাধ্যমে এই টেক্সটকে পরিবর্তন হতে দেই</h2></div>

<button>কন্টেন্ট পরিবর্তন করি</button>

</body>
</html>

ফলাফল




উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("button").click(function(){
        $.ajax({url: "demo_ajax_script.js", dataType: "script"});
    });
});
</script>
</head>
<body>

<button>একটি জাভাস্ক্রিপ্ট ফাইল পেতে এবং রান করতে অ্যাজাক্স ব্যবহার করি</button>

</body>
</html>

ফলাফল




উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("button").click(function(){
        $.ajax({url: "wrongfile.txt", error: function(xhr){
            alert("একটি এঁরর ঘটেছে: " + xhr.status + " " + xhr.statusText);
        }});
    });
});
</script>
</head>
<body>

<p>আর্টিষ্ট</p>
<div></div>

<button>সিডির বিবরণী দেখি</button>

</body>
</html>

ফলাফল




জেকুয়েরি ajaxSetup()মেথড


উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("button").click(function(){
        $.ajaxSetup({url:"wrongfile.txt",error:function(xhr){
            alert("একটি এঁরর হয়েছেঃ " + xhr.status + " " + xhr.statusText);
        }});
    $.ajax();
    });
});
</script>
</head>
<body>

<p>আর্টিষ্ট</p>
<div></div>

<button>সিডির বিবরণী</button>

</body>
</html>

ফলাফল




জেকুয়েরি ajaxError()মেথড


উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $(document).ajaxError(function(e, xhr, opt){
        alert("এঁরর রিকুয়েস্ট " + opt.url + ": " + xhr.status + " " + xhr.statusText);
    });
    $("button").click(function(){
        $("div").load("wrongfile.php");
    });
});
</script>
</head>
<body>

<div><p>আজাক্সের মাধ্যমে এই টেক্সটকে পরিবর্তন হতে দেই</p></div>

<button>কন্টেন্ট পরিবর্তন করি</button>

</body>
</html>

ফলাফল




জেকুয়েরি ajaxSuccess()মেথড


উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $(document).ajaxSuccess(function(e, xhr, opt){
        if (opt.url == "demo_ajax_load.txt") {
            alert("অ্যাজাক্স রিকুয়েস্ট সফলভাবে সম্পন্ন হয়েছে");
        };
    });
    $("button").click(function(){
        $("div").load("demo_ajax_load.txt");
    });
});
</script>
</head>
<body>

<div><p>অ্যাজাক্সের মাধ্যমে এই টেক্সটকে পরিবর্তন হতে দেই</p></div>

<button>কন্টেন্ট পরিবর্তন করি</button>

</body>
</html>

ফলাফল




জেকুয়েরি load()মেথড


উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("input").keyup(function(){
        txt = $("input").val();
        $("span").load("demo_ajax_gethint.php", {suggest: txt});
    });
});
</script>
</head>
<body>

<p>নিচের ইনপুট ফিল্ডে একটি নাম লিখিঃ</p>
নাম:

<input type="text">

<p>পরামর্শঃ <span></span></p>

</body>
</html>

ফলাফল




উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("button").click(function(){
        $("div").load("demo_cd_catalog.xml",function(response, status){
            if (status == "success"){
                $("div").html("<ol></ol>");
                $(response).find("artist").each(function(){
                    var item_text = $(this).text();
                    $('<li></li>').html(item_text).appendTo('ol');
                });
                alert("এখানে " + $(response).find("cd").size() + " CD রয়েছে।")
            }
        });
    });
});
</script>
</head>
<body>

<p>আর্টিষ্ট</p>
<div></div>
<button>সিডি'র বিবরণী</button>

<p>এই উদাহরণে <a href="demo_cd_catalog.xml" target="_blank">demo_cd_catalog</a> এই এক্সএমএল ফাইলটি ব্যবহার করা হয়েছে</p>

</body>
</html>

ফলাফল




উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("button").click(function(){
        $("div").load("wrongname.",function(response, status, xhr){
            if (status == "success"){
                $("div").html("<ol></ol>");
                $(response).find("artist").each(function(){
                    var item_text = $(this).text();
                    $('<li></li>').html(item_text).appendTo('ol');
                });
            } else {
                $("div").html("একটি এঁরর হয়েছেঃ <br>" + xhr.status + " " + xhr.statusText)
            }
        });
    });
});
</script>
</head>
<body>

<p>আর্টিষ্ট</p>
<div></div>

<button>সিডির বিবরণি</button>

<p>এই উদাহরণে <a href="demo_cd_catalog.xml" target="_blank">demo_cd_catalog</a>এই এক্সএমএল ফাইলটি ব্যবহার করা হয়েছে</p>

</body>
</html>

ফলাফল