無法使電話號碼可點擊（使用CoffeeScript的Rails應用程序）

我正在運行餐館發現網站，用戶在地圖上看到一堆標記，他們點擊標記並打開一個infoWindow，其中用戶可以看到餐廳的元數據細節。無法使電話號碼可點擊（使用CoffeeScript的Rails應用程序）

問題：我試圖讓餐廳的電話號碼可點擊。當我查看輸出時，在HTML中，我看到一個可點擊的鏈接，但沒有看到該鏈接中的電話號碼，而是看到我的變量名（附帶屏幕截圖）。當我點擊鏈接時，我收到一條錯誤消息（截圖附上）。

請參閱附件代碼 - 正在呈現的相關CoffeeScript文件和HTML視圖。

MAIN.COFFEE FILE

infoHTML = (data) -> 
    img = if data.photo then "<img onerror='this.parentNode.removeChild(this)' src='#{data.photo}' style='margin:5px 5px 0 0;max-height:70px'>" else '' 
    html = "<table><tr><td style='vertical-align:top'>#{img}</td><td>" 
    html += data.name + '<br>' 
    html += data.address + '<br>' 
    html += "<a href= '+ data.phone + '> + data.phone</a>" + '<br>' if data.phone 
    html += "<img src='/assets/uber.jpg' style='max-height:13px'> £#{data.cost}" + '<br>' if data.cost 
    if data.michelin_status && data.michelin_status != 'yes' 
    html += data.michelin_status + '<br>' 
    html += data.rating + '% rated' if data.rating 
    html + '</td></tr></table>'

查看所呈現

我所看到的WHE N I按一下手機上LINK

來源

2015-10-17 hikmatyar

你的「在該線路上組合和」。看起來你需要'之前的' – Doon

你混你的報價，所以不是

html += "<a href= '+ data.phone + '> + data.phone</a>" + '<br>' if data.phone

使用

html += "<a href= '"+ data.phone + "'>" + data.phone + "</a><br>" if data.phone

此外，檢查How to mark-up phone numbers?

更新 - 與tel:前綴：

html += "<a href= 'tel:"+ data.phone + "'>" + data.phone + "</a><br>" if data.phone

來源

2015-10-17 12:28:34 Vucko

不起作用。通過你的修復，我現在可以在視圖中看到這個數字，但是如果我點擊這個數字，我會得到一個Action Controller異常消息，表示路由錯誤 - 沒有路由匹配。 – hikmatyar

這就是它應該如何工作的原因，因爲您將該電話號碼添加到href中，因此您可以獲得，例如'123-4567-89「'，它將查找不存在的路線。我已經添加了額外的鏈接到我的答案，並檢查它看看你如何創建一個可點擊的電話號碼（我相信你需要添加'tel：'前綴 - '123-4567-89「'） – Vucko

是的，它的工作原理是通過添加前綴 – hikmatyar

無法使電話號碼可點擊（使用CoffeeScript的Rails應用程序）

回答

相關問題