0

我尝试使用 java 脚本。当我单击字母表时，我看不到图像。我对 java 脚本很陌生。任何帮助表示赞赏。

    function iterateAlphabet(var index)
{
        var nextChar;
        var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
            for(var index=0; index<str.length; index++)
            {
                nextChar = str.charAt(index);
                break;
            }
        return nextChar;
    }

    function getCharacter(var index)
        var  character = document.getElementById("alphabetA");
        character.innerText=iterateAlphabet(index);
}
    </script>
</head>

<body>
    <table>
        <tr>
        <td><input type="image" src="imgs\\1.jpg" alt="a"  id="alphabetA"  onclick ="iterateAlphabet('0')" value="Apple"></input></td>
    </table>

4

2 回答 2

0

HTML 结构（根据需要设置样式，只需保留元素的 id，或者根据需要在 html 和 js 中更改它们）：

<table>
        <tr>
        <td id="letters" onclick ="iterateAlphabet()">

        A
        </td>
        <td> <img src='A.jpg' id="alpha" ></td>
    </table>

Javascript：

i = 0;

function iterateAlphabet()
{
  var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
  if (i < str.length)
  {
    i++;
    var nextChar = str.charAt(i);

document.getElementById("letters").innerHTML = nextChar;
    document.getElementById("alpha").src = nextChar + '.jpg';



    if (i == str.length - 1)
    {

      i = -1;

    }
  }

}

最重要的是： - 您应该在同一目录中有名为 A.jpg、B.jpg 等...等的图像，这将起作用。

于 2013-07-02T00:00:21.697 回答
0

试试这个功能

（函数迭代字母（）{

 var alpha = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split(''),
     imageUrl = "http://dummyimage.com/50x50/2e2e2e/fff&text=";

alpha.forEach( function(el){
  var link = document.createElement('A');
      link.href = imageUrl + el;
      link.innerHTML = el;

   // console.log(link); 

    document.write(link); // you can use any code here to show the links

 });

})()

于 2013-07-01T23:36:32.030 回答