❶ 急用啊，先謝謝大神們，使用的thinkphp框架，html頁面中怎麼實現上面輸出內容下面跟著改變
js就可以做到
<input type="number" onkeypress="showNum(this.value)">
<div id="showTxt"></div>
<script>
function showNum(val){
document.getElementById("showTxt").innerHTML = val;
}
</script>
❷ thinkphp中html頁面怎麼引入html頁面
8.7 包含文件
可以使用Include標簽來包含外部的模板文件，使用方法如下：
include標簽（包含外部模板文件）
閉合
閉合標簽
屬性
file（必須）：要包含的模板文件，支持變數
示例：
1、 使用完整文件名包含
格式：<include file="完整模板文件名" />
例如：
<include file="./Tpl/default/Public/header.html" />
這種情況下，模板文件名必須包含後綴。使用完整文件名包含的時候，特別要注意文件包含指的是伺服器端包含，而不是包含一個URL地址，也就是說file參數的寫法是伺服器端的路徑，如果使用相對路徑的話，是基於項目的入口文件位置。
2、包含當前模塊的其他操作模板文件
格式：<include file="操作名" />
例如 導入當前模塊下面的read操作模版：
<include file="read" />
操作模板無需帶後綴。
3、 包含其他模塊的操作模板
格式：<include file="模塊名:操作名" />
例如，包含Public模塊的header操作模版：
<include file="Public:header" />
4、包含其他模板主題的模塊操作模板
格式：<include file="主題名:模塊名:操作名" />
例如，包含blue主題的User模塊的read操作模版：
<include file="blue:User:read" />
5、 用變數控制要導入的模版
格式：<include file="$變數名" />
例如
<include file="$tplName" />
給$tplName賦不同的值就可以包含不同的模板文件，變數的值的用法和上面的用法相同。
無論你使用什麼方式包含外部模板，Include標簽支持在包含文件的同時傳入參數，例如，下面的例子我們在包含header模板的時候傳入了title和keywords變數：
<include file="header" title="ThinkPHP框架"keywords="開源WEB開發框架"/>
就可以在包含的header.html文件裡面使用var1和var2變數，方法
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>[title]</title>
<meta name="keywords" content="[keywords]" />
</head>
注意：由於模板解析的特點，從入口模板開始解析，如果外部模板有所更改，模板引擎並不會重新編譯模板，除非在調試模式下或者緩存已經過期。如果部署模式下修改了包含的外部模板文件後，需要把模塊的緩存目錄清空，否則無法生效。
❸ thinkphp框架可以用來實現路由器web管理界面嗎lighttpd伺服器支持這個php框架不
thinkphp 是否支持 是看你的伺服器上支持多少版本的PHP 管理界面是html 至於後台運行的程序是什麼樣的 就需要你去用php或者其他語言去寫了thinkphp 只是一個框架而已
❹ thinkphp框架安裝後怎麼用
thinkphp框架安裝後使用方法：
1、ThinkPHP最新版本可以在官方網站下載。
2、下載後的壓縮文件解壓到WEB目錄（或者任何目錄都可以），框架的目錄結構為：
├─ThinkPHP.php框架入口文件
├─Common框架公共文件
├─Conf框架配置文件
├─Extend框架擴展目錄
├─Lang核心語言包目錄
├─Lib核心類庫目錄
│├─Behavior核心行為類庫
│├─Core核心基類庫
│├─Driver內置驅動
││├─Cache內置緩存驅動
││├─Db內置資料庫驅動
││├─TagLib內置標簽驅動
││└─Template內置模板引擎驅動
│└─Template內置模板引擎
└─Tpl系統模板目錄
注意，框架的公共入口文件ThinkPHP.php是不能直接執行的，該文件只能在項目入口文件中調用才能正常運行，這是很多新手很容易犯的一個錯誤。
3、接下來先在WEB根目錄下面創建一個app子目錄（這個就是app就是項目名），然後在該目錄下面創建一個index.php文件，添加一行簡單的代碼：
<?php
require '/ThinkPHP框架所在目錄/ThinkPHP.php';
這行代碼的作用就是載入ThinkPHP框架的入口文件ThinkPHP.php，這是所有基於ThinkPHP開發應用的第一步。然後，在瀏覽器中訪問這個入口文件。
http://localhost/app/
歡迎界面如下：
❺ 怎麼用thinkphp搭建前端後台框架
以前用PHP做過一個很蹩腳的網站，為什麼這么說呢，因為寫的全是死代碼。做完以後覺得實在是累，前端要div+css,js 後端要php,MySQL，這么多東西要弄，十分頭疼。所以，在接到做網站的任務後，我第一時間想到一定要使用開發框架去做，絕不能跟以前一樣那麼累了。
我選擇的是PHP的ThinkPHP框架。說實話，真的蠻不錯的。瞬間覺得Web開發還是蠻有效率的。
超級鏈接：ThinkPHP中文網
按照套路，首先貼一下實驗環境：
1. WAMP（集成的那種，最Easy的幾乎不需要配置）
2. ZendStudio7.2（中文網址http://www.zendstudio.net/，裡面提供下載，在線注冊機以及使用教程）
3. ThinkPHP框架+網路UEditor編輯器插件
4. Win7-64bit操作系統
5. 瀏覽器（火狐，IE，Chrome），外加火狐FireBug插件用於調試以及偷樣式
❻ 調用別人介面api，在thinkphp框架下怎麼在前端頁面得到自己的數據
首頁要確定你獲取到的是什麼數據格式的
一般來說都是xml 和 json
你把得到數據整理後存放到變數裡面，在列印出數據就可以了啊 很簡單的
❼ thinkphp為什麼要分前後端控制器
你好，你說的Admin和Index只是模塊的分組，每個模塊都是MVC結構，這樣可以有效防止前後端的代碼沖突及後期維護，通過不同的訪問地址來執行不同模塊的代碼，這樣就算兩個模塊的控制器和方法命名一樣也不會沖突。
比如前後台都有個首頁的訪問，習慣性命名一樣。如訪問index.php/Index/index/index 或 index.php/Admin/index/index 雖然控制器和方法一樣，但是模塊不同 不會沖突。當然你也可以比如在Index模塊內寫所有前後端的代碼，只是這樣結構有點混亂，不建議。
❽ thinkphp的前端用什麼框架
一個後端框架，問前端用什麼框架，這樣合適嗎》
❾ 如何在thinkphp中使用b-jui
B-JUI 前端框架
B-JUI（Bootstrap for DWZ）是一個富客戶端框架，基於DWZ-jUI富客戶端框架修改。
本文是B-JUI中文使用手冊，包括使用示例代碼，感興趣的同學參考下。
概覽
B-JUI僅有一個主頁面(document)，框架內的所有子頁面將通過Ajax獲取後作為一個頁面片段附加到主頁面上，外部頁面則通過iframe嵌入主頁面， 本節介紹 B-JUI的主頁面結構。
HTML5 文檔類型
同Bootstrap， B-JUI使用 HTML5 文檔類型，參照下面的格式進行設置。
<!DOCTYPE html>
<html lang="zh-CN">
...
</html>
主頁面結構(僅body部分)
主頁面由上（頁頭）、中左（導航菜單）、中右（工作區）、下（頁腳）四部分組成，其中左側導航菜單可收縮。結構如下：
<header class="bjui-header" id="bjui-header">
<!-- 頁頭 -->
</header>
<div class="bjui-leftside" id="bjui-leftside">
<!-- 導航菜單 -->
</div>
<div id="bjui-container">
<!-- 工作區 -->
</div>
<footer class="bjui-footer" id="bjui-footer">
<!-- 頁腳 -->
</footer>
子頁面（即頁面片段[後面簡稱：頁片]）結構
頁片通常由兩部分組成，也可以只保留bjui-pageContent部分，其中bjui-pageContent部分可選bjui-headBar（頂部工具條）和bjui-footBar（底部工具條）。結構如下：
<div class="bjui-pageHeader">
<!-- 頂部模塊[如：功能按鈕、搜索麵板] -->
</div>
<div class="bjui-pageContent">
<div class="bjui-headBar">
<!-- 頂部工具條 -->
</div>
<div data-layout-h="0">
<!-- 內容區 -->
</div>
<div class="bjui-footBar">
<!-- 底部工具條 -->
</div>
</div>
data-layout-h 屬性表示該容器為頁片自適應布局，當值為0時，B-JUI會為該容器的高度自動賦值為：本頁片總高度減去本頁片中的固定元素(bjui-pageHeader\bjui-headBar\bjui-footBar)高度。
data-layout-h 屬性值不等於0時，該容器高度為本頁片總高度減去屬性值。
需要自定義固定元素(塊級元素有效)，請為該元素添加屬性data-layout-fixed="true"
完整的頁片詳見B-JUI源代碼的table.html，僅bjui-pageContent部分的頁片詳見form.html
元素ID命名規范
因為本框架默認所有內容都位於一個Document中，所以為元素命名ID的時候需要做到唯一性，如果確實不可避免的會出現有重復ID的現象，需要操作當前頁片的元素時，盡量用：
$.CurrentNavtab.find('#dom-id')，在當前標簽工作區中查找指定ID的元素。
或 $.CurrentDialog.find('#dom-id')，在當前彈窗中查找指定ID的元素。
標簽式工作區(navtab)
B-JUI框架的整個工作區部分就是一個navtab組件，本組件位於主頁面的"#bjui-container"容器內，固定的html結構如下：
<div id="bjui-navtab" class="tabsPage">
<div class="tabsPageHeader">
<div class="tabsPageHeaderContent">
<ul class="navtab-tab nav nav-tabs">
<li data-tabid="main" class="main active"><a href="javascript:;"><span>我的主頁</span></a></li>
</ul>
</div>
<div class="tabsLeft"><i class="fa fa-angle-double-left"></i></div>
<div class="tabsRight"><i class="fa fa-angle-double-right"></i></div>
<div class="tabsMore"><i class="fa fa-angle-double-down"></i></div>
</div>
<ul class="tabsMoreList">
<li><a href="javascript:;">我的主頁</a></li>
</ul>
<div class="navtab-panel tabsPageContent layoutBox">
各頁片內容區域
</div>
</div>
用法(如何創建一個navtab)：
DOM點擊觸發：
<a href="mytab.html" data-toggle="navtab" data-id="mynavtab" data-title="我的業務頁面">打開navtab</a>
<button type="button" class="btn-green" data-toggle="navtab" data-id="mynavtab" data-url="mytab.html" data-title="我的業務頁面">打開navtab</button>
jQuery：
$(selector).navtab({id:'標簽的id', url:'載入頁片的url', title:'標簽的標題'})
取得當前navtab的內容容器：$.CurrentNavtab
參數：
名稱 類型 默認值 描述 id string navtab 標簽的ID，如果指定重復，將覆蓋現有的ID相同標簽。 title string New tab 標簽打開後顯示的名稱。 url string undefined 請求數據的url。 type string GET Http請求方式，可選『GET/POST』。 data object {} 請求url時，需要發送的data數據。
方法：
這樣調用navtab的方法：
$(selector).navtab('方法名', 參數1, ..., 參數n)
如要切換到某個標簽：
$(selector).navtab('switchTab', 標簽ID)
方括弧的參數，表示該參數可選。
可用的方法：
switchTab(tabid)：切換到某個標簽。
refresh(tabid)：刷新某個標簽。
reload(options)：重新載入某個標簽，options同navtab默認參數，如果未指定ID，則默認重載入當前標簽。
closeTab(tabid)：關閉某個標簽。
closeCurrentTab([tabid])：關閉當前標簽。
closeAllTab()：關閉所有標簽。
事件：
這樣監聽navtab的事件：
$(document).on('bjui.beforeLoadNavtab', function(e) {
var $navtab = $(e.target)
// do something...
})
名稱 描述 bjui.beforeLoadNavtab 載入標簽內容前的事件 bjui.beforeCloseNavtab 關閉標簽前的事件
彈出窗口(dialog)
彈出窗口分為普通彈出窗口和模態彈出窗口，普通彈出窗口可通過taskBar組件進行最小化等操作。彈出窗口的DOM結構會放入Body中，結構如下：
<div class="bjui-dialog bjui-dialog-container">
<div class="dialogHeader">
<!-- 最大化、最小化、關閉等按鈕區 -->
<h1><!-- 標題 --></h1>
</div>
<div class="dialogContent layoutBox unitBox">
<!-- 頁片內容區 -->
</div>
<!-- 用於調整大小的div片斷 -->
</div>
用法(如何創建一個dialog)：
DOM點擊觸發：
<a href="mydialog.html" data-toggle="dialog" data-id="mydialog" data-title="我的彈出窗口">打開彈出窗口</a>
<button type="button" class="btn-green" data-toggle="dialog" data-id="mynavtab" data-url="mytab.html" data-title="我的彈出窗口">打開彈出窗口</button>
jQuery：
$(selector).dialog({id:'彈窗的id', url:'載入頁片的url', title:'彈窗的標題'})
取得當前dialog：$.CurrentDialog
參數：
名稱 類型 默認值 描述 id string navtab 彈窗的ID，如果指定重復，將覆蓋現有的ID相同彈窗。 title string New tab 彈窗打開後顯示的名稱。 url string undefined 請求數據的url。 type string GET Http請求方式，可選『GET/POST』。 data object {} 請求url時，需要發送的data數據。 width int 500 彈窗的寬度。 height int 300 彈窗的高度。 max boolean false 打開彈窗時直接最大化。 mask boolean false 是否模態窗口。 resizable boolean true 可以調整彈窗的大小。 drawable boolean true 可以拖動彈窗。 maxable boolean true 是否顯示最大化按鈕。 minable boolean true 是否顯示最小化按鈕（模態彈窗無效）。
方法：
調用方式同navtab： 如要關閉某個彈窗：
$(selector).dialog('close', 彈窗ID)
方括弧的參數，表示該參數可選。
可用的方法：
switchDialog(id)：切換到某個彈窗(模態彈窗無效)。
refresh(id)：刷新某個彈窗。
reload(options)：重新載入某個彈窗，options同dialog默認參數，如果未指定ID，則默認重載入當前彈窗。
close(id)：關閉某個彈窗。
closeCurrent()：關閉當前彈窗。
事件：
這樣監聽dialog的事件：
$(document).on('bjui.beforeLoadDialog', function(e) {
var $dialog = $(e.target)
// do something...
})
名稱 描述 bjui.beforeLoadDialog 載入彈窗內容前的事件 bjui.beforeCloseDialog 關閉彈窗前的事件
Ajax
本節主要介紹B-JUI框架中的Ajax操作，回調函數等。
Ajax操作：
ajax搜索 - 主要用於搜索表單，分頁表單，例：B-JUI源碼"table.html"中的#pagerForm：
<form id="pagerForm" data-toggle="ajaxsearch" action="table.html" method="post">
ajax重置搜索 - 主要用於重置搜索表單，data-clear-query屬性告訴form是否清空查詢參數，僅保留分頁及欄位排序信息，例：B-JUI源碼"table.html"中的清空查詢按鈕：
<a class="btn btn-orange" href="javascript:;" data-toggle="reloadsearch" data-clear-query="true" data-icon="undo">清空查詢</a>
ajax載入 - 主要用於為指定容器載入url的內容，data-target屬性值為選擇器表達式，告訴ajax載入的內容放到該容器，適合用來做局部刷新：
<a href="table-edit.html" data-toggle="ajaxload" data-target="#D11">載入內容</a>
ajax動作 - 主要用於執行ajax命令，如「刪除」，data-confirm-msg屬性用於在操作前進行確認提示：
<a href="del.html" class="btn btn-red" data-toggle="doajax" data-confirm-msg="確定要刪除該行信息嗎？">刪除數據</a>
ajax導出 - 主要用於導出信息(下載文件)，data-confirm-msg屬性用於在操作前進行確認提示：
<a href="book1.xlsx" data-toggle="doexport" data-confirm-msg="確定要導出信息嗎？">導出全部</a>
ajax導出選中項 - 主要用於導出選中項信息(下載文件)，data-confirm-msg屬性用於在操作前進行確認提示，data-idname屬性指定發送到後台的欄位名稱，默認「ids」，data-group屬性用於指定復選框的name：
<a href="book1.xlsx" data-toggle="doexportchecked" data-confirm-msg="確定要導出選中項嗎？" data-idname="expids" data-group="ids">導出選中項</a>
ajax刪除選中項 - 主要用於導出選中項信息(下載文件)，data-confirm-msg屬性用於在操作前進行確認提示，data-idname屬性指定發送到後台的欄位名稱，默認「ids」，data-group屬性用於指定復選框的name：
<a href="del.html" data-toggle="dodelchecked" data-confirm-msg="確定要刪除選中項嗎？" data-idname="delids" data-group="ids">導出選中項</a>
Ajax回調：
ajaxsearch、doajax、dodelchecked三種ajax操作支持自定義ajax回調函數，自定義的回調函數放到data-callback屬性，寫法如下：。
<a href="del.html" class="btn btn-red" data-toggle="doajax" data-confirm-msg="確定要刪除該行信息嗎？" data-callback="mycallback">刪除數據</a>
function mycallback(json) {
//do something...
}
服務端返回的JSON參數如下：
名稱 類型 描述 statusCode int 必選。狀態碼(ok = 200, error = 300, timeout = 301)，可以在BJUI.init時配置三個參數的默認值。 message string 可選。信息內容。 tabid string 可選。待刷新navtab id，多個id以英文逗號分隔開，當前的navtab id不需要填寫，填寫後可能會導致當前navtab重復刷新。 closeCurrent boolean 可選。是否關閉當前窗口(navtab或dialog)。 forward string 可選。跳轉到某個url。 forwardConfirm string 可選。跳轉url前的確認提示信息。
默認的回調函數會根據當前觸發元素的位置確定是刷新navtab還是dialog，或是局部div容器。
可調用的返回信息提示：
$(selector).bjuiajax('ajaxDone', json)
表格
表格的Class同Bootstrap，僅調整了padding值，使表格顯示得更緊湊。
.table 少量的padding和水平分隔線。
.table-striped 條紋狀表格 [IE8 不支持]。
.table-bordered 帶邊框表格。
.table-hover 附加滑鼠懸停效果。
表格表頭欄位排序按鈕實現：
<th data-order-field="sex">姓名</th>
<th data-order-direction="asc" data-order-field="createtime">創建時間</th>
data-order-field=""屬性令本欄位可排序，屬性值為與後台交互的欄位名稱。
data-order-direction屬性表示本欄位的當前排序狀態，可選值(asc/desc)
普通表格
普通的表格，可顯示列表狀條目，或布局表單，表頭欄位可附加排序按鈕。
完整的實例詳見B-JUI源代碼的table.html。
固定表頭表格
表格的頭可固定住，可調整各列的寬度，表頭欄位可附加排序按鈕。
<table data-toggle="tablefixed" data-width="100%" data-layout-h="0">
表格添加屬性data-toggle="tablefixed"後就會固定表頭，B-JUI默認為固定的表頭的表格添加Class：table table-striped table-bordered table-hover，如果該table設置有Class，則以設置的為准
data-width屬性可定義固定表格的寬度，默認為"100%"，可設置大於100%或固定值，如：150%和1200都是合法的，超過navtab工作區的寬度時會出現橫向滾動條。
完整的實例詳見B-JUI源代碼的table-fixed.html。
可編輯表格
用於需要動態添加簡單行內容的地方。
<table class="table table-bordered table-hover table-striped" data-toggle="tabledit" data-initnum="0" data-layout-h="0">
<thead>
<tr>
<th title="No."><input type="text" name="edit[#index#].id" class="no" data-rule="required" value="1" size="2"></th>
<th title="姓名"><input type="text" name="edit[#index#].name" data-rule="required" value="" size="5"></th>
<th title="" data-addtool="true" width="100">
<a href="javascript:;" class="btn btn-red row-del" data-confirm-msg="確定要刪除該行信息嗎？">刪</a>
</th>
</tr>
</thead>
</table>
實現步驟：
表格添加屬性data-toggle="tablefixed"；
thead中添加上對應的表單信息，欄位名放到title屬性上；
若想在某列上顯示添加按鈕，需在對應列上添加屬性data-addtool="true"；
若每行顯示刪除按鈕，需為刪除按鈕添加Classrow-del，如果要確認才能刪除，需為刪除按鈕添加屬性data-confirm-msg="刪除提示信息"。
表格的data-initnum屬性，表示載入本頁片時，初始化的添加行數，值為0時不需寫。
外部觸發添加行事件：
按鈕式：
<button type="button" class="btn-green" data-toggle="tableditadd" data-target="#tabledit1" data-num="1">添加編輯行</button>
data-target屬性設置編輯表格的jQuery選擇器，data-num屬性設置點擊時添加的行數。
jQuery：$(selector).tabledit('add', 編輯表格的jQuery對象, 待添加的行數)
$(selector).tabledit('add', $('#tabledit1'), 2)
完整的實例詳見B-JUI源代碼的table-edit.html。