How to get "SRC" or URL or tag of selected image

Last post 11-16-2009, 9:15 AM by Kenneth. 7 replies.
Sort Posts: Previous Next
  •  07-14-2006, 8:10 AM 20980

    How to get "SRC" or URL or tag of selected image

    Hi,
     
    I have used the following code to get the src of a selected image:
     
    if(editselection.type=='Control')
     {
         if(range.length==1)
        {
            var element=range.item(0);
      
            if(element.tagName=='IMG')
           {
               // alert(element.src);
              textBox.value=element.src;
           }
        }
     }
     
    I would like to get the whole tag as I will be using it to create a URL
     
    This is the whole tag
    <img src="../filemanager/previewfile.ashx?id=57917&amp;thumb=true">
     
    This is returned by element.src;
     
    So, I have 2 problems:
     
    How do I get the whole tag out?
     
    How do I stop it from returning
    instead of
    ../filemanager/previewfile.ashx?id=57917&amp;thumb=true
     
    Thank you.
     
     
  •  07-14-2006, 1:40 PM 20991 in reply to 20980

    Re: How to get "SRC" or URL or tag of selected image

    the4bs,
     
    >>How do I get the whole tag out?
     
    There is such JavaScript API available.
     
    You need to write your own code.
     
    Tip: 

    For IE, please check outerHTML Property.

    outerHTML Property - Sets or retrieves the object and its content in HTML.

    http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/properties/outerhtml.asp
     
     
    >>How do I stop it from returning
    instead of
    ../filemanager/previewfile.ashx?id=57917&amp;thumb=true
     
    Please use the following code:

         var src;
         src = element.getAttribute("src") + '' ;
         if(element.getAttribute("src_cetemp"))
          src = element.getAttribute("src_cetemp") + '' ; 
     
     
     
     
     


    asp.net Chat http://cutesoft.net/ASP.NET+Chat/default.aspx
    Web Messenger: http://cutesoft.net/Web-Messenger/default.aspx
    asp.net wysiwyg editor: http://cutesoft.net/ASP.NET+WYSIWYG+Editor/default.aspx
    asp wysiwyg html editor: http://cutesoft.net/ASP
    asp.net Image Gallery: http://cutesoft.net/ASP.NET+Image+Gallery/default.aspx
    Live Support: http://cutesoft.net/live-support/default.aspx

  •  07-17-2006, 8:38 AM 21009 in reply to 20991

    Re: How to get "SRC" or URL or tag of selected image

    Please use the following code:

         var src;
         src = element.getAttribute("src") + '' ;
         if(element.getAttribute("src_cetemp"))
          src = element.getAttribute("src_cetemp") + '' ; 
     
    Thank you.
    That seems to work.
  •  11-15-2009, 11:03 PM 57160 in reply to 21009

    Re: How to get "SRC" or URL or tag of selected image

    What is the value of element here?
  •  11-15-2009, 11:57 PM 57161 in reply to 20980

    Re: How to get html DOM of IMG element of selected image in Firefox

    function getSelectedHTML()   
    {      
          var rng=null,html="";         
          
          // get the active editor document
          var editdoc = editor1.GetDocument();

          // get the active editor window 
          var editwin = editor1.GetWindow();   
          if (document.selection && document.selection.createRange)   
          {      
                rng=editdoc.selection.createRange();   
               if( rng.htmlText )    
               {    
                  html=rng.htmlText;    
               }    
               else if(rng.length >= 1)    
               {    
                  html=
    rng.item(0).outerHTML;    
               }   
          }   
          else if (window.getSelection)   
          {   
                rng=editwin.getSelection();   
                if (rng.rangeCount > 0 && window.XMLSerializer)   
                {   
                      rng=rng.getRangeAt(0);   
                      html=new XMLSerializer().serializeToString(rng.cloneContents());   
                }   
          }   
          return html;   
     
     
    Using above function I am able to get  selected html:
    http://cutesoft.net/developer+guide/scr/Get-HTML-from-Selection.htm
     
    Now, I need to add NAME and ID attribute to IMG element. 
     
    In IE, highlighted line gives IMG element DOM, but in Firefox no luck, any ideas?
     
    Thanks,
    Maulik 
    Filed under: ,
  •  11-16-2009, 6:58 AM 57174 in reply to 57161

    Re: How to get html DOM of IMG element of selected image in Firefox

    Hi maulikce,
     
    In firefox the like below gives IMG element DOM
     
    rng=rng.getRangeAt(0);  
     
    Regards,
     
    ken
  •  11-16-2009, 8:13 AM 57175 in reply to 57174

    Re: How to get html DOM of IMG element of selected image in Firefox

    Thanks for your response. 
     
    It does not seem to work though, I want to manipulate DOM of Image element and it seems to return something else.
     
    Any alternative? 
     
     
  •  11-16-2009, 9:15 AM 57176 in reply to 57175

    Re: How to get html DOM of IMG element of selected image in Firefox

    Hi maulikce,
     
     else if (window.getSelection){
            rng=editwin.getSelection();
            if (rng.rangeCount > 0 && window.XMLSerializer)
            {
              rng=rng.getRangeAt(0);
              for(var i=0;i<rng.startContainer.childNodes.length;i++)
              {
              if(rng.startContainer.childNodes[i].tagName=="IMG")
              {
            
                html=rng.startContainer.childNodes[i].src;
              }
         
              }
           
            }
          }
     
    Regards,
     
    Ken
View as RSS news feed in XML