我试图从我的主页面到管理面板

时间:2017-01-14 18:36:24

标签: javascript jquery html

我正在创建一个管理面板,而且我一直在尝试将变量从主页面传递到管理面板,主页面不在同一个文件夹中,不确定是否会出现这样的情况。这是打断它的东西但是我发现你可以做到这一点 localStorage.setItem(something,value) 我尝试在管理面板中输入与主页中的输入相同,这是我的代码 主页

<ul id="aidi" style="display: inline-block;"> <!-- Don't change -->
            <li style="margin-left: 40px;">
            <input value="Ziggs" id="1st" style="background-color: transparent; border: 0px;" disabled="yes"> <!-- 1st Champion's name -->
            </li>
            <li style="margin-left: -120px;"> <!-- 2nd Champion's name -->
            <input value="thresh" id="2nd" style="background-color: transparent; border: 0px;" disabled="yes">
            </li>
            <li style="margin-left: -120px;"> <!-- 3rd Champion's name -->
            <input value="darius" id="3rd" style="background-color: transparent; border: 0px;" disabled="yes">
            </li>
            <li style="margin-left: -120px;"> <!-- 4th Champion's name -->
            <input value="lux" id="4th" style="background-color: transparent; border: 0px;" disabled="yes">
            </li>
        </ul>
        <ul id="aidi2"> <!-- Dates -->
            <li style="margin-left: 55px;" > <!-- 1st Champion's date -->
                Dec 8,2016
            </li> 
            <li style="margin-left: 235px;"> <!-- 2nd Champion's date -->
             Dec 6,2016
            </li>
            <li style="margin-left: 230px;"> <!-- 3rd Champion's date -->
             Dec 4,2016
            </li>
            <li style="margin-left: 225px;"> <!-- 4th Champion's date -->
            Dec 3,2016
            </li>
        </ul> <!-- Don't change -->

获取变量代码:

$(document).ready(function(){

    $first = $('#1st').val();
    $second = $('#2nd').val();
    $third = $('#3rd').val();
    $forth = $('#4th').val();
    localStorage.setItem('1st' , $first);
    localStorage.setItem('2nd' , $second);
    localStorage.setItem('3rd' , $third);
    localStorage.setItem('4th' , $forth);

});

尝试在我的管理面板 jquery

中获取变量
$(document).ready(function() {

var first = $('1st');
var second = $('2nd');
var third = $('3rd');
var forth = $('4th');
$('#firstchamp').val() = localStorage.getItem("1st");
$('#secondchamp').val() = localStorage.getItem("2nd");
$('#thirdchamp').val() = localStorage.getItem("3rd");
$('#forthchamp').val() = localStorage.getItem("4th");

});

管理员代码:

<div id="jumbotron">
    <div class="container" id="homepagecon">
        <h1 id="homepage">Home Page</h1>
            <div class="champs"><img src="http://ddragon.leagueoflegends.com/cdn/img/champion/splash/Darius_4.jpg"><input id="firstchamp" value="" style="background-color: transparent;border: 0px;"></div>
            <div class="champs"><img src="http://ddragon.leagueoflegends.com/cdn/img/champion/splash/Darius_1.jpg"><input id="secondchamp" style="background-color: transparent;border: 0px;"></div>
            <div class="champs"><img src="https://s-media-cache-ak0.pinimg.com/originals/15/27/a9/1527a98dcc96c4fead214e15737d8fa9.jpg"><input id="thirdchamp" style="background-color: transparent;border: 0px;"></div>
            <div class="champs"><img src="http://img15.deviantart.net/5477/i/2016/158/5/3/darius_by_siakim-da5cc7z.jpg"><input id="forthchamp" style="background-color: transparent;border: 0px;"></div>
    </div>
</div>

2 个答案:

答案 0 :(得分:4)

问题在于您在管理面板中设置值的方式,.val()函数被滥用,您需要使用它如下(并且BTW不需要前四个语句):

$(document).ready(function() {
    $('#firstchamp').val(localStorage.getItem("1st"));
    $('#secondchamp').val(localStorage.getItem("2nd"));
    $('#thirdchamp').val(localStorage.getItem("3rd"));
    $('#forthchamp').val(localStorage.getItem("4th"));
});

答案 1 :(得分:3)

设置val()函数使用不正确请尝试以下代码设置值,请查看.val()以获取更多信息

$(document).ready(function() {

    var first = $('1st');
    var second = $('2nd');
    var third = $('3rd');
    var forth = $('4th');
    $('#firstchamp').val(localStorage.getItem("1st"));
    $('#secondchamp').val(localStorage.getItem("2nd"));
    $('#thirdchamp').val(localStorage.getItem("3rd"));
    $('#forthchamp').val(localStorage.getItem("4th"));

});