JQuery ब्लॉकयूआई

मेरे पास एक ही वर्ग (जेएस-कार) के साथ कई डिव हैं, ब्लॉकयूआई को लागू करने की कोशिश कर रहे हैं, 'ब्लॉक' बटन के क्लिक पर मैं एक ही वर्ग (जेएस-कार) के साथ सभी डिव को ब्लॉक करना चाहता हूं, यह काम करता है, लेकिन संकेतक केवल अंतिम div में आ रहा है। मैं इसे सभी divs में संकेतक दिखाने के लिए कैसे बना सकता हूं?

<!DOCTYPE html>
<html lang="en">
<head>
    <script type="text/javascript" src="/_ui/responsive/common/js/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="/_ui/responsive/common/js/jquery.blockUI-2.66.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {

            $('#blockButton').click(function() {
                $('div.js-car').block({ message: $("<img src='/_ui/responsive/common/images/spinner.gif'/>") });
            });

            $('#unblockButton').click(function() {
                $('div.js-car').unblock();
            });

        });
    </script>
</head>
<body>
    <button id="blockButton">Block</button>
    <button id="unblockButton">Unblock</button>

    <div class="js-car">
        <a href="#" class="test">Test link - click me!</a>
        <p>
        <select><option>Option 1</option><option>Option 2</option></select>
        lorem ipsum dolor sit amet
        consectetuer adipiscing elit
        sed lorem leo
        lorem leo consectetuer adipiscing elit
        sed lorem leo
        rhoncus sit amet
        <select><option>Option 1</option><option>Option 2</option></select>

        lorem ipsum dolor sit amet
        consectetuer adipiscing elit
        sed lorem leo
        <a href="#" class="test">Test link - click me!</a>
        lorem leo consectetuer adipiscing elit
        sed lorem leo
        rhoncus sit amet<br>
        <textarea rows="2" cols="20">test textarea</textarea>
    </div>

    <div class="js-car">
        <a href="#" class="test">Test link - click me!</a>
        <p>
        <select><option>Option 1</option><option>Option 2</option></select>
        lorem ipsum dolor sit amet
        consectetuer adipiscing elit
        sed lorem leo
        lorem leo consectetuer adipiscing elit
        sed lorem leo
        rhoncus sit amet
        <select><option>Option 1</option><option>Option 2</option></select>

        lorem ipsum dolor sit amet
        consectetuer adipiscing elit
        sed lorem leo
        <a href="#" class="test">Test link - click me!</a>
        lorem leo consectetuer adipiscing elit
        sed lorem leo
        rhoncus sit amet<br>
        <textarea rows="2" cols="20">test textarea</textarea>
    </div>

</body>
</html>
0
SyAu 18 फरवरी 2021, 10:34

1 उत्तर

सबसे बढ़िया उत्तर

लगता है इस समस्या का कोई समाधान नहीं है, https://github.com/malsup/blockui/issues/20

मैंने नीचे दिए गए संकेतक/स्पिनर को जोड़ने के लिए अपना कोड अपडेट किया है,

        $(".blockUI.blockMsg.blockElement > img").remove();
        $(".blockUI.blockMsg.blockElement").append("<img 
             src='/_ui/responsive/common/images/spinner.gif'>");
0
SyAu 19 फरवरी 2021, 00:58