有问题被选中img src并在文本字段中显示

Question

Can anyone please help me with a issue am having with javascript and on selection?, first of all what am trying to do is when I select a image from a list of images I want to get the image src and store it to a var that I can use else were now the problem am having when I select image i get the following src portraits/00000/00008.jpg now I need to remove the portraits and both / and the .jpg from the src so i just got the folder ID and image ID and add them to a fieldtext box in realtime without refreshing page.

<script type="text/javascript">
    $(document).ready(function() {
      $('.portrait').click(function(){
        var idimg = $(this).attr('id');
        var srcimg = $(this).attr('src');

        alert(srcimg); // shows debug

      });
    });
    </script>

<input name="sel-avatar" type="textfield" id="avatar" value="IMAGEID" />
<input name="sel-avatardir" type="textfield" id="avatardir" value="FOLDERID"

image display is

<img id=\"portrait\" class=\"portrait\" src=\"{$files[$pos]}\" width=\"88\" height=\"88\" border=\"1\" />

can anyone help ?

Answer 1

Could be this you're looking for?

<script type="text/javascript">
    $(document).ready(function() {
      $('.portrait').click(function(){
        var idimg = $(this).attr('id');
        var srcimg = $(this).attr('src');

        var splitSrc = srcimg.split("/");

        var folder = splitSrc[1];
        var splitFile = splitSrc[2].split(".");
        var fileId = splitFile[0];
        document.getElementById("avatar").value=fileId;
        document.getElementById("avatardir").value=folder;

      });
    });
</script>

Answer 2

if you are sure you would get in the same format ie folder ID, then image ID, image name you could use the split function to get the javascript array and fetch the details from the array..

<script type="text/javascript">
"portraits/00000/00008.jpg".split(/[\/]+/)
</script>

Array [ "portraits", "00000", "00008.jpg" ]

Answer 3

Try this:

var ary = srcimg.split(/\/|\./g);

var folder = ary[1];

var file = ary[2];

The assumption here is that you'll have one folder and there aren't any periods in the folder or file name, except before the file extension. If there are multiple folders, we have to change the assignment slightly, but the split statement is the same.