I'm wondering how to store a value in a custom javascript object when a JQueryMoblile element, such as from a control group, is clicked. Then, when JQM transitions to another page, I would like to retrieve the value from the javascript object and display it or otherwise use it. (for the purposes of asking the question, I will just display it)
我想知道如何在单击JQueryMoblile元素(例如来自控件组)时将值存储在自定义javascript对象中。然后,当JQM转换到另一个页面时,我想从javascript对象中检索值并显示它或以其他方式使用它。 (为了提出问题,我只是展示它)
javascript code:
function valueholder()
{
this.value = "";
}
html code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JQM javascript test</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
<link rel="stylesheet" href="/css/jquery.mobile-1.4.5.min.css"/>
<script src="/js/jquery-2.1.4.min.js"></script>
<script src="/js/jquery.mobile-1.4.5.min.js"></script>
<script src="/js/valueholder.js"></script>
</head>
<body>
<div id="home" data-role="page" data-title="Home Page">
<div data-role="header" data-position="fixed">
<h1>Main</h1>
</div>
<div data-role="content"><p>First Page</p></div>
<div data-role="controlgroup">
<!-- when either of these below are clicked, I would like to set the create a valueholder -->
<!-- object from the .js file and set either X or Y based on which is clicked -->
<a href="#detailpage" data-transition="slide" data-role="button" data-mini="true" data-icon="arrow-r" data-iconpos="right">Go To Detail Page - With Value X</a>
<a href="#detailpage" data-transition="slide" data-role="button" data-mini="true" data-icon="arrow-r" data-iconpos="right">Go To Detail Page - With Value Y</a>
</div>
</div>
<div id="detailpage" data-role="page" data-title="Detail Page">
<div data-role="header" data-position="fixed">
<h1>Detail</h1>
<a href="#home" data-icon="home" data-iconpos="notext" data-transition="slide" data-direction="reverse">Home</a>
</div>
<div data-role="content">
<p>Detail Page</p>
<!-- then I would like to retrieve the value from the valueholder object and display it here -->
<p>Value Is: (would like to display the value from javascript here)</p>
</div>
</body>
</html>
1 个解决方案
#1
0
Add an id or class to the elements you can click. For example, #xValue
and #yValue
. Then add a class or id to where you want to put the value. For example, #putValueHere
在您可以单击的元素中添加id或类。例如,#xValue和#yValue。然后将类或ID添加到要放置值的位置。例如,#putValueHere
<!-- when either of these below are clicked, I would like to set the create a valueholder -->
<!-- object from the .js file and set either X or Y based on which is clicked -->
<a id="xValue" href="#detailpage" data-transition="slide" data-role="button" data-mini="true" data-icon="arrow-r" data-iconpos="right">Go To Detail Page - With Value X</a>
<a id="yValue" href="#detailpage" data-transition="slide" data-role="button" data-mini="true" data-icon="arrow-r" data-iconpos="right">Go To Detail Page - With Value Y</a>
And
<!-- then I would like to retrieve the value from the valueholder object and display it here -->
<p id="putValueHere">Value Is: (would like to display the value from javascript here)</p>
Then
$("#xValue").click(function(){
$("#putValueHere").html("Value Is: X");
});
$("#yValue").click(function(){
$("#putValueHere").html("Value Is: Y");
});
#1
0
Add an id or class to the elements you can click. For example, #xValue
and #yValue
. Then add a class or id to where you want to put the value. For example, #putValueHere
在您可以单击的元素中添加id或类。例如,#xValue和#yValue。然后将类或ID添加到要放置值的位置。例如,#putValueHere
<!-- when either of these below are clicked, I would like to set the create a valueholder -->
<!-- object from the .js file and set either X or Y based on which is clicked -->
<a id="xValue" href="#detailpage" data-transition="slide" data-role="button" data-mini="true" data-icon="arrow-r" data-iconpos="right">Go To Detail Page - With Value X</a>
<a id="yValue" href="#detailpage" data-transition="slide" data-role="button" data-mini="true" data-icon="arrow-r" data-iconpos="right">Go To Detail Page - With Value Y</a>
And
<!-- then I would like to retrieve the value from the valueholder object and display it here -->
<p id="putValueHere">Value Is: (would like to display the value from javascript here)</p>
Then
$("#xValue").click(function(){
$("#putValueHere").html("Value Is: X");
});
$("#yValue").click(function(){
$("#putValueHere").html("Value Is: Y");
});