Question

我希望我的按钮在点击时跳转到页面底部，而不会中断我的其他代码。最好不是任何Jquery，我还不太满意。

    <script>
    var refreshBtn = document.getElementById('refresh'),
        textHolder = document.getElementById('text'),
        textArray = [
        'Raw horse meat is a popular food in Japan.',
        'Sometimes the trains are so crowded railway staff are employed to cram passengers inside.',
        'Many couples in Japan celebrate Christmas like Valentines Day.  It is definitely more of a "lovers" holiday in Japan.',
        'Poorly written English can be found everywhere, including T-shirts and other fashion items.',
        'More than 70% of Japan consists of mountains, including more than 200 volcanoes.',
        'Mt. Fuji, the tallest mountain in Japan, is an active volcano (although scientists have not reached a consensus on what defines "active").',
        'Religion does not play a big role in the lives of most Japanese and many do not understand the difference between Shintoism and Buddhism.  However, there are also many Japanese who do understand the difference.',
        'A nice musk melon, similar to a cantaloupe, may sell for over $300.  For example, a nice specimen of Yubari melon.  These are often physically perfect, not like their American counterparts with dark smudges and scars.',
        'There are four different writing systems in Japan; Romaji, Katakana, Hiragana, and Kanji.',
        "Coffee is very popular and Japan imports approximately 85% of Jamaica's annual coffee production.",
        "Japan's literacy rate is almost 100%.",
        "Sumo is Japan's national sport, although baseball is also very popular.",
        'Sumo wrestlers eat a stew called Chankonabe to fatten up. Many restaurants in the Ryogoku district of Tokyo serve this nabe (Japanese word for stew).',
        'Most toilets in Japan have a built-in bidet system for spraying your backside.  These are known as washlets and are now the norm in homes and nicer restrooms.  However, in some train stations and other public restrooms you may still find the traditional Japanese "floor toilet".',
        "When you use the restroom in someone's home you may need to put on designated bathroom slippers so as not to contaminate the rest of the home.",
        'Noodles, especially soba (buckwheat), are slurped somewhat loudly when eaten. It has been said slurping indicates the food is delicious.  The slurping also serves to cool down the hot noodles for eating.',
        'Japan is the world’s largest consumer of Amazon rain forest timber.',
        'Vending machines in Japan sell beer, hot and cold canned coffee, cigarettes, and other items.',
        'When moving into an apartment it is often required to give the landlord "gift" money, usually equal to two months rent.',
        'On average there are around 1,500 earthquakes every year in Japan.',
        'In Japan it is not uncommon to eat rice at every meal, including breakfast.',
        'Average life expectancy in Japan is one of the highest in the world. Japanese people live an average of 4 years longer than Americans.',
        'Japan is the largest automobile producer in the world.',
        "Tsukiji market in Tokyo is the world's largest fish market.",
        'Ovens are not nearly as commonplace as rice cookers in Japanese households.',
        'It was customary in ancient Japan for women to blacken their teeth with dye as white teeth were considered ugly. This practice persisted until the late 1800s.  The American style smile (big, wide, and white) would have been seen as "exposing too much bone".',
        'In addition to a "boneless smile", small eyes, a round puffy face, and plump body were considered attractive features, especially during the Heian period.',
        "Some Japanese companies conduct a morning exercise session for the workers to prepare them for the day's work.",
        ],
        randomIndex = 0,
        previousIndex = 0; // We'll use that to avoid getting the same text twice in a row

    refreshBtn.onclick = updateText;

    function updateText(){
        while(randomIndex === previousIndex) {
            randomIndex = Math.floor( Math.random() * textArray.length );
        }
        previousIndex = randomIndex;
        textHolder.innerHTML = textArray[ randomIndex ];
    }
    </script>

很抱歉我的按钮有很长的CSS块，我不确定是否有必要。如果不需要，有人让我知道，我将删除它。这是按钮的Javascript。

compile 'net.sf.opencsv:opencsv:2.3'

就是这样。它可能非常简单，但是当我尝试添加一些东西时，我一直搞乱代码。

Answer 1

我能想到的两种方式：

首先，您可以使用JS滚动到底部

window.scrollTo(0,document.body.scrollHeight);

其次，您可以在页面底部添加标记

<a name="bottom"></a>

并使用

document.location.href="#bottom";

Answer 2

你可以用HTML做这个。将要跳转的ID设置为 href 属性，如下所示：

<a href="#jump-here" class="refresh">Jump to the end</a>

在页面底部，您希望链接跳转到的位置，在标记上添加ID，如下所示：

<div id="jump-here">Jump Here</div>

使我的按钮将用户跳到页面底部

2 个答案: