नमस्ते, मैं Greasemonkey और JavaScript की दुनिया में नया हूँ..

मैं प्रत्येक ऑनक्लिक फ़ंक्शन को उसके संबंधित img src लिंक के एक भाग से बदलना चाहता हूं

स्रोत इस तरह दिखता है:

<div id="playlist_container">
                    <div id="video_container" onclick="playvid('a1a1a1a1a1',3201)" class="playing">
                <div id="thumbnail">
                                                <img src="https://.../thumb/ABCD.jpg">
                                            </div>
                <div id="title"></div>
                <div id="synopsis">
                    Vid 1                    </div>
            </div>
            <hr>
                    <div id="video_container" onclick="playvid('b2b2b2b2bb2',3202)" >
                <div id="thumbnail">
                                                <img src="https://.../thumb/EFGH.jpg">
                                            </div>
                <div id="title"></div>
                <div id="synopsis">
                    Vid 2                    </div>
            </div>

मैं ऑनक्लिक 'प्लेविड' a1a1a1a1a1 और b2b2b2b2bb2 और c3c3c3c3c3c3 ... को img src लिंक के हिस्से से बदलना चाहता हूं

ऐसा बनने के लिए:

<div id="playlist_container">
                    <div id="video_container" onclick="playvid('ABCD',3201)" class="playing">
                <div id="thumbnail">
                                                <img src="https://.../thumb/ABCD.jpg">
                                            </div>
                <div id="title"></div>
                <div id="synopsis">
                    Vid 1                    </div>
            </div>
            <hr>
                    <div id="video_container" onclick="playvid('EFGH',3202)" >
                <div id="thumbnail">
                                                <img src="https://.../thumb/EFGH.jpg">
                                            </div>
                <div id="title"></div>
                <div id="synopsis">
                    Vid 2                    </div>
            </div>

यहां मैंने अभी तक कोशिश की है:

          var els = $("#playlist_container");
          var cod = $("div#thumbnail img").prop("src").replace(/(https(.+)\/thumb\/|.jpg)/gi, '');
          for(var i=0;i<els.length;i++){
          var el = els[i];
          el.innerHTML = el.innerHTML.replace(/playvid(.)(.)(\w+)(.)/gi, "playvideo('" + cod +"'");
          }

यह मेरे लिए काम करता है लेकिन मुद्दा यह है कि यह नीचे दिखाए गए सभी 'playvid ()' कार्यों के लिए पहला कोड 'एबीसीडी' डालता है:

<div id="playlist_container">
                    <div id="video_container" onclick="playvid('ABCD',3201)" class="playing">
                <div id="thumbnail">
                                                <img src="https://.../thumb/ABCD.jpg">
                                            </div>
                <div id="title"></div>
                <div id="synopsis">
                    Vid 1                    </div>
            </div>
            <hr>
                    <div id="video_container" onclick="playvid('ABCD',3202)" >
                <div id="thumbnail">
                                                <img src="https://.../thumb/EFGH.jpg">
                                            </div>
                <div id="title"></div>
                <div id="synopsis">
                    Vid 2                    </div>
            </div>

एक और मुद्दा यह है कि जब मैं $ ("# video_container") का प्रयास करता हूं तो यह काम नहीं करता है मुझे नहीं पता क्यों, मैं बहुत उलझन में हूं और इस पर कुछ भी नहीं ढूंढ सकता

0
Joey Z. 15 जून 2020, 03:14

1 उत्तर

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

आपके html में डुप्लिकेट आईडी मान हैं जो सही तत्व खोजने में समस्याएँ पैदा कर सकते हैं। यदि आप एकाधिक तत्वों को लक्षित करना चाहते हैं तो कक्षा का उपयोग करने का प्रयास करें।

इस कोड को केवल पहला तत्व मान मिलता है

var cod = $("div#thumbnail img").prop("src").replace(/(https(.+)\/thumb\/|.jpg)/gi, '');

इस कोड को आजमाएं और मुझे बताएं कि यह कैसा चल रहा है

var images = $("div.thumbnail img");
      
images.each(function(img) {
  var name = $(this).prop("src").replace(/(https(.+)\/thumb\/|.jpg)/gi, '');
  var container = this.closest("div.video_container");
  var evt = $(container).attr("onclick").replace(/playvid(.)(.)(\w+)(.)/gi, "playvideo('" + name +"'");
  $(container).attr("onclick", evt);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="playlist_container">
  <div class="video_container" onclick="playvid('a1a1a1a1a1',3201)" class="playing">
    <div class="thumbnail">
      <img src="https://.../thumb/ABCD.jpg">
    </div>
    <div class="title"></div>
    <div class="synopsis">Vid 1</div>
  </div>
  <hr>
  <div class="video_container" onclick="playvid('b2b2b2b2bb2',3202)" >
    <div class="thumbnail">
      <img src="https://.../thumb/EFGH.jpg">
    </div>
    <div class="title"></div>
    <div class="synopsis">Vid 2</div>
  </div>
0
hallie 15 जून 2020, 01:35