2

I'm trying to invoke a function onChange of an attribute value. What I'm trying is, When the user clicks on one of below div

 <div id="selected" class="vblock">
 <div class="vblock">
 <div class="vblock">
 <div class="vblock">
 <div class="vblock">

The value of src attribute of embed tag will be changed.

<embed id="vplayer" width="100%" height="100%" name="plugin" src="resources/videos/xyz21.mp4" type="video/mp4">

I need to invoke a function during the change of src value.

or

I need to invoke the function during the modification of <div class="vblock"> to <div id="selected" class="vblock">

What I tried is :

$('embed[src=#]').change(function(e){
 // code

Please anyone help me to do this stuff...Thanks.....

James
  • 2,874
  • 4
  • 30
  • 55

1 Answers1

5

My thougth on this problem:

1). You would better close your divs.

2). Instead of <div id="selected" class="vblock"> you should use <div class="vblock selected"> this is what classes for.

3). You can't listen attribute changes (well you can, but mutation events are deprecated anyway..), but you can manually trigger your event handler:

$('.vblock').on('click', function() {
    // do something, set new src
    $('#vplayer').trigger('src:changed');
});

$('#vplayer').on('src:changed', function () {
    // src changed, do something
});
dfsq
  • 191,768
  • 25
  • 236
  • 258
  • But there is no response for `$('#vplayer').on('src:changed', function () {` event... I can't do anything on click event. Because I'm adding `id=selected` during the `click` event. Using this `id` I'm retrieving some values. If I use click event It will result null. – James Feb 21 '13 at 20:12
  • But the same code is not working for me. Is there any way to make `delay` the execution of a function. Like `delay(1000)` in `java`. – James Feb 21 '13 at 20:49
  • `setTimeout(function() { alert('Delayed'); }, 1000);` – dfsq Feb 21 '13 at 20:59
  • Thank You sir `setTimeout(function()},time);` worked for me.. Thank you very Much........ – James Feb 22 '13 at 07:45